以圖換字是CSS布局中非常常用的一種手段，因為圖片文字有時候比可選的文字的表達效果更好！
因此，某些文字標題是用圖片來表達的。但寫一個img標簽實在不雅，為了照顧蜘蛛，我們使用浏覽器障眼法。
於是用最常用的text-indent：
CSS:
示例代碼 [www.mb5u.com]
h4 a{background:url(http://www.w3cbbs.com/images/w3cbbs/logow3cbbs.png) left top no-repeat;width:300px;height:75px;text-indent:300px; white-space:nowrap; overflow:hidden;}
XHtml:
示例代碼 [www.mb5u.com]
<h4><a href="#">CSS網頁布局w3c標准</a></h4>
但你會發現，在IE6中，沒有得到期望的效果，背景圖片和文字都被隱藏了（IE7也是這樣，其它的未做測試）。
解決辦法至少有兩個：
示例代碼 [www.mb5u.com]
1： 將display:inline-block;改為display:block;
2：去掉display:inline-block;屬性，加float:left;屬性。