[CSS]画像とテキストの置き換え

仕事がらみでCSS覚え書き。
今まではテキストと画像を置き換えて作るCSSメニューなどはblock指定で背景に画像。テキストはtext-indent:-9999pxとかやっていたけど、どうもこの方法はあまりよくないらしい。

いろいろと方法はあるようだけど、小さなblockを作ってoverflow: hiddenってのが良さそう。
今度からこれでやってみようっと。

HTML部分
<div id=”menu”>
<span>テキスト</span>
</div>

/* css */
#menu {
width: 329px;
height: 25px;
background-image: url(画像パス);
}
#menu span {
display: block;
width: 0;
height: 0;
overflow: hidden;
}

[CSS]画像とテキストの置き換え” への2件のフィードバック

  1. 先日はありがとうございました!
    おかげさまで、数日間悩みのタネだったものが、アッというまに解決しました。

    で、またまた疑問が・・・

    またメッセージでお聞きしていいでしょうか??(^^;

コメントを残す