网络编程
位置:首页>> 网络编程>> 网页设计>> 关于CSS中字号控制的兼容性研究[译](2)

关于CSS中字号控制的兼容性研究[译](2)

作者:ximicc 来源:ximicc博客 发布时间:2009-02-24 16:35:00 

标签:兼容,字体,浏览器,css


BODY中的百分比字号– iteration 3

对于在第二个测试中IE6和7所出现的问题,我们可以通过设置body标签的百分比字号来解决,当然对于其它元素的文本还是沿用em单位字号: 

body {
    font-size:100%;
}

.bodytext p {
    font-size:0.875em;
}

.sidenote {
    font-size:0.75em;
}

示例中可以看到,我们已经基本达成了文本缩放一致的目的。

用PX设置行高 – iteration 4

最近一些关于Web文档打印的文章,如Setting Type on the Web to a Baseline Grid,强调了一个良好的印刷格式在垂直方向上也应该体现栅格特质,其中最重要的因素就是行高,它应该不受字号设置的影响。

举个例子,一种比较恰当的行高设置是18px,我们可以在body标签中进行定义:

body {
    font-size:100%;
    line-height:18px;
}

.bodytext p {
    font-size:0.875em;
}

.sidenote {
    font-size:0.75em;
}

结果示例中可以看到,无论是主体还是侧边,所有的文本都继承了18px的行高。当然这是在为行高值定义了单位的情况下。如果我们采用比例因子之类省略单位的行高设置,行高就会随着字号的变化而变化,当然某些情况下这也可能是我们需要的结果。

不幸的是在IE6和7下18px的行高不会随文本的缩放而变化,这就意味这文本足够大的时候可能会产生重叠的现象。

0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com