字体隐藏(text-indent:-9999px)在IE8下的显示问题

2014-08-28阅读(8571)评论(0)牵着狗狗看MM

苏州实时公交查询

为什么要字体隐藏?

通常为了传达更好的视觉效果,我们常用图片替代掉字体。但是为了html语义化,常常要给内容模块加上一些标题来让页面更有意义,在抛开css裸奔的情况下也能很顺利的汲取到页面信息。为此我们需将图片上的字体隐藏。

一般来说,偏移掉字体的方式是使用:text-indent:-9999px;

问题如图
1
HTML结构

<ul>
  <li><a href="#">1</a></li>
  <li><a href="#">2</a></li>
...
...
</ul>

其中的1,2为自动生成,这里想把数字隐藏,就用text-indent:-9999px

但是在IE8下就出现问题:
2

解决方法:把a标签定义为块级元素即可,即对a标签增加一个dispaly:block属性

赞(0)
转载请注明来源:Web前端(W3Cways.com) - Web前端学习之路 » 字体隐藏(text-indent:-9999px)在IE8下的显示问题
分享到: 更多 (0)