热门资讯更多>>
- 05-03[网站建设]关于IE6下绝对定位…
- 11-23[网站建设]jquery 做TABS切换…
- 02-13[网站建设]——dopostback缺…
- 07-14[网站优化]如何修改网站标题…
- 11-13[网站建设]SQLSERVER2005 数…
- 09-25[网站建设]屏蔽 Flash 右键的…
- 03-13[网站建设]Windows+ IIS 的手…
- 03-22[网站建设]谈谈如何利用网络…
- 03-04[网站建设]magento整合WORDP…
- 02-07[网站建设]MSSQL备份移植到另…
IE8的一个BUG:Hack 兼容方案
字体真是个麻烦的东西,然后又是个重要的东西。为以更方的解决字体问题,就像上次推荐的《再谈 Web 默认字体》,为了Pixel Perfect,我们不断纠结。像支付宝在CSS Reset中是这样写的:
- body{font:12px Tahoma,Helvetica,Arial,'宋体',sans-serif}
而淘宝这样写:
- body, button, input, select, textarea {font:12px/1.5 tahoma,arial,'宋体',sans-serif;}
个人偏向于淘宝的写法,显然,button/input/select/textarea的字体都是要重设才会显示正常的。这里并不是为了讨论这个,而是这里面都有 tohama 这种字体,它是今天的主角。因为字体显示好,也因为导致 BUG 而被搬上台面。让我们来先看一个Demo:
Here: IE8 Tahoma Font-family bug
如果你是从 IE8 打开,将会看到第一个按钮有错位。如标题所说,你懂的,这就是 Tahoma 给我们带来的问题。而解决方案很简单,就是避用 tahoma 字体,其他的随便。比如:
- body, button, input, select, textarea {font:12px/1.5 arial,'宋体',sans-serif;}
在支持没有那么完美的状况下,这样的解决方式可以说是完美的。即使你像我一样也有一套 Hack 兼容方案,还是不推荐使用暴力方式,我们的目标是、也应该是更有效、更优雅。
然后,其实 hack IE 8的时候,可以考虑 selector{property:value;}
这样的方法来,因为这是 IE8+ 独有的方法。Hmmm… 多好,虽然有点暴力。最后,推荐一下鸽子工友。解决这个 Bug,还得归功于他。
——————————–
经过一条完美分割线从火星来到地球,囧,刚刚还测试了arial放在前面是可以的,而且早上测试过,不过,事实证明测试要更小心,要多次,不然可能刷出来的是缓存。事实的解决方法似乎是这样的:
- 有中文和英文混排的时候,怎么写都无所谓;
- 只有中文的时候,放在前面最好的系统所拥有的字体,或者一种系统没有的字体来让他显示默认字体;
- 全英文就更是所所谓了
多谢帮助寻找真相的 Justice 和 默默同学,一个问到底,一个提供一个非中文的 IE8 显示效果图片。