ie6的文字行高表现

2010年07月16日 18:32
问题描述：body中设置的字体“宋体”在ie6中影响了文字行高的显示位置会偏上，而在其它浏览器中并不存在这种现象。代码如下：

<style type="text/css">
body,p {
    margin:0;
    padding:0;
}
body { font:12px/1.5 "宋体", Arial, Helvetica, sans-serif; }
.desc{
     width:400px;
     border:1px solid red;
     color:#800000;  
     text-align:center;
     font-weight:bold;
}
p {
    margin-top:4px;
    background:silver;
}
</style>
</head>
<body>
    <p class="desc">其实这与字体设置有一定的关系</p>
    <p>我在ie6下是偏上显示的，哈哈！</p>
    <p>English words display</p>
</body>

为了解决这个问题，就不能把宋体放在最前面，使用Arial就不存在这样的问题。

ps:这里额外提供两个使用line-height的注意事项：

1.行高设置不可高过高度设置，否则在ie6中将会自动扩展以最高高度为准；
2.行高若是为奇数，则在不同浏览器中上下填充的行空解析不一致，如行高为21px，字体为14px，谷歌浏览器上为3px，下为4px，而火狐相反。建议设置行高为偶数。
posted @ 2010-12-03 13:50  xmlovecss  阅读(137)  评论(0)  编辑  收藏  举报