我有一个页面在 FF(3x、4x)、Chrome、IE(6、7、8)中呈现正常。
在 IE9 上测试时,文本更宽。 调查问题后发现,文本实际上呈现为比其他浏览器中的字母间距更大。
当将字母间距更改为 -0.6px 时,文本呈现正常,类似于其他浏览器。 此外,当将呈现模式更改为“兼容性 View ”时,页面看起来也很好。
你知道渲染模式发生变化的原因吗?
我使用条件注释“解决”了这个问题,但我对此不是很满意
<!--[if IE 9]>
<style>
* {letter-spacing: -0.6px;}
</style>
<![endif]-->
有没有其他方法可以解决这个问题?
编辑
我在不同的机器不同的浏览器上截了几个图可以看到结果here
如您所见,在不同的机器上使用不同的浏览器结果是一样的。唯一呈现不同的是标准模式下的 IE9。源页面是
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title></title>
<style type="text/css">
body {margin:0;padding:0;}
</style>
</head>
<body>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc semper.
</body>
</html>
最佳答案
这可能与四舍五入有关。使用十分之一像素是一件奇怪的事情,因为除非您知道四舍五入的方式,否则您不能在屏幕上得到小于整个像素的像素。无论如何,您不能依赖 IE 来获得正确的结果。
关于css - IE9字母间距问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5512169/