1ã¤ã®SVGスプライト画åƒã‚’CSS背景画åƒã¨ã‚¤ãƒ³ãƒ©ã‚¤ãƒ³HTMLã®ä¸¡æ–¹ã§èªã¿è¾¼ã‚€æ–¹æ³•ã“ã®è¨˜äº‹ã¯ã€ŒSVG Advent Calendar 2015 ã€ã®9日目ã®è¨˜äº‹ã§ã™ã€‚åˆã‚ã¦Advent Calendarçš„ãªã‚‚ã®ã«å‚åŠ ã•ã›ã¦ã‚‚らã„ã¾ã™ã€‚よã‚ã—ããŠé¡˜ã„ã—ã¾ã™ã€‚ ※Advent Calendarã®ç· ã‚切りãŒã‚ã‚‹ã®ã§ã€æ¤œè¨¼é€”ä¸ã§ã™ãŒå…¬é–‹ã—ã¡ã‚ƒã„ã¾ã™ï¼ã”了承ãã ã•ã„。ç¾æ®µéšŽã§ã¯ã€æ—§ãƒ–ラウザをサãƒãƒ¼ãƒˆã™ã‚‹ãŸã‚ã®ãƒ•ã‚©ãƒ¼ãƒ«ãƒãƒƒã‚¯ãŒæœ€å¾Œã¾ã§æ¤œè¨¼ã§ãã¦ã„ãªã„ã§ã™ã€‚ã‚ã¨ã§è¿½è¨˜ã—ã¾ã™ã€‚ —–ã“ã“ã‹ã‚‰æœ¬æ–‡â€”– ãã‚ãã‚ãƒã‚´ã¨ã‹ã‚¢ã‚¤ã‚³ãƒ³ã¾ã‚ã‚Šã®ç”»åƒã‚’SVGã«ç§»è¡Œã—ãŸã„ã¨æ€ã„ã€Gulpを使ã£ã¦è¤‡æ•°ã®SVGアイコンを1ã¤ã«ã¾ã¨ã‚るアイコンシステムを検証ã—ã¦ã“ã®ãƒ–ãƒã‚°ã§ã‚‚紹介ã—ã¾ã—ãŸã€‚ã§ã‚‚ã€Gulpã®è¨å®šã«æ…£ã‚Œã¦ã„ãªã„ã¨é›£ã—ã„ã—ã€CSSã§èƒŒæ™¯ç”»åƒã¨ã—ã¦èªã¿è¾¼ã‚ãªã„ã¨ã„ã†ãƒ‡ãƒ¡ãƒªãƒƒãƒˆã‚‚ã‚ã‚Šã¾ã—ãŸã€‚ ãã“ã§ã€ä»Šå›žã¯ãƒã‚´ã‚„アイコンãªã©ã®è¤‡æ•°ã®ç”»åƒã‚’ã€Sketchã§ã‚¹ãƒ—ライトã«ã¾ã¨ã‚ã¦1ã¤ã®SVGç”»åƒã¨ã—ã¦ä¿å˜ã—
{{#tags}}- {{label}}
{{/tags}}