Compassで簡単、CSSスプライト作成 第1回 CSSスプライト作成の基礎 CompassでCSSスプライトが手軽にできるのをご存知ですか? この記事ではCompassでCSSスプライトを作成する基礎を解説します。業務で使うものですから、生成の仕組みもおさえておきましょう。 はじめに 手作業で作ると、ものすごい手間がかかってしまうCSSスプライトですが、Compassを使えば、非常に簡単に実装することができます。このシリーズではCompassのCSSスプライト機能を解説し、Retinaディスプレイ対応のCSSスプライトmixinを作ってみます。 Compassと私 Compassについては、CodeGridでSassの連載時に、簡単に触れました。 SassとCSS設計 - 運用と管理 | CodeGrid Compass Home | Compass Documentation Com
![Compassで簡単、CSSスプライト作成 | 第1回 CSSスプライト作成の基礎](https://cdn-ak-scissors.b.st-hatena.com/image/square/145f9b324aaa53d46455e690f046558129db6875/height=288;version=1;width=512/https%3A%2F%2Fcodegrid.imgix.net%2Fimage.png%3Fixlib%3Djs-3.8.0%26w%3D1200%26h%3D630%26mark%3Dhttps%253A%252F%252Fcodegrid.imgix.net%252F~text%253Fixlib%253Djs-3.8.0%2526w%253D1000%2526txt%253DCSS%2525E3%252582%2525B9%2525E3%252583%252597%2525E3%252583%2525A9%2525E3%252582%2525A4%2525E3%252583%252588%2525E4%2525BD%25259C%2525E6%252588%252590%2525E3%252581%2525AE%2525E5%25259F%2525BA%2525E7%2525A4%25258E%2526txt-fit%253Dmax%2526txt-size%253D57%2526txt-font%253DHiragino%252520Sans%252520W5%2526txt-color%253Dfff%26mark-x%3D90%26mark-y%3D195%26blend%3D%2523BD1818%26blend-mode%3Doverlay%26txt%3DCompass%25E3%2581%25A7%25E7%25B0%25A1%25E5%258D%2598%25E3%2580%2581CSS%25E3%2582%25B9%25E3%2583%2597%25E3%2583%25A9%25E3%2582%25A4%25E3%2583%2588%25E4%25BD%259C%25E6%2588%2590%2520%257C%2520%25E7%25AC%25AC1%25E5%259B%259E%26txt-align%3Dtop%252Cleft%26txt-font%3DHiragino%2520Sans%2520W5%26txt-size%3D30%26txt-pad%3D100%26txt-color%3Dfff)