peketaminの日記

その辺のプログラマーのチラ裏です。

CSS スプライトメモ

CSSスプライトについてあれこれ。

上記のページを参考に、

text-indentとwhite-spaceとoverflowを使った画像置換(Scott Kellum Method)

として、下記のように解説されている、

p.btn a {
  display: block;
  width: 200px;
  height: 60px;
  background: url(../img/btn.gif);
  white-space: nowrap;
  text-indent: 100%;
  overflow: hidden;
}

の方法を使った。

速いは正義!CSSスプライトの作成効率を10倍高めるGlueの使い方まとめ : DeNA Creator(クリエイター) Blog

も参考にしようと思ったけど、今回はデザインデータありきで、とくにHTML化を前提に作成されたものではなかったので、断念。