在css样式中字体使用应注意的一些问题

在css样式中字体使用应注意的问题: 一、字体的选用要考虑该文字的用途，是做标题呢，还是段落文字？ 大家如果手头有报纸,看上一眼就会发现绝大部分报纸上采用的字体就是"黑体"(文章标题),"宋体"(文章正文),"楷体"(文章附加说明文档). 通常来说:font-family:"宋体", Verdana, Arial, sans-serif; font-family:"黑体", "Times New Roman", serif; font-family:"楷体_GB2312", Georgia, serif; 下面是使用不同字体时，我们所看到的不同效果的html页面 二、字体的大小 字体的大小在CSS里，有很多不同的单位，大致上有三类, 　　绝对大小：mm, cm, in, pt, pc 　　相对大小：em, ex 　　相对于设备：px 　可能要多说几句的是 em 和 ex，em 在 css 里代表就是字体字号的大小，例如对于12 pt的字体来说, 1 em 就等于12 pt 范例： 　　p { 　　　　font-size: 10pt; 　　　　text-indent: 1em 　　} 　也许你会说我可以用text-indent: 10pt来实现同样的效果啊，但那只是在理想的情形下，如果用户觉得他的浏览器设置字体大小为14pt更好的时候， 你所设计的比例就失去了，所以相对尺寸对于网页的可伸缩性设计是非常有利的。 　ex 和 em 类似，但不尽相同， 回到上面的图示，x-height 对于每一种字体来说是不同的，ex 是根据字体的 x-height 来定义字体的大小。 em与px 不同：em的值并不是固定的，em会继续父级元素的字体大小.所以我们会在字体的控制上较多的使用em，而在页面的布局和定位上使用px； 为什么em是最好的字体控制方式呢？？？ 首先em是相对的，比px之类绝对大小灵活。 其次，百分数虽然也是相对的，但是因为百分数定义存在误差积累的问题（如果根据百分数计算出来的值，很可能被浏览器进行四舍五入地等处理，如果多次进行这样的处理，得到的值就不能精确地还原了。） 而且em定义的字体大小在浏览器中是可以进行大小调整的，px之类定义的是不能进行字体大小控制的。因此就算用户调整了浏览器的默认字体大小，也可以通过调整浏览器的显示来放大或缩小字体大小。 三、行间距 行间距取决于字体的大小，一般来说，小的字号需要大一点的行间距来便于阅读，中文字体在网页上如果没有行间距的设定，对于阅读大段文字来说是读者的灾难，所以适当设定line-height是非常必要的。一般地， line-height 在网页设计中应该是字体大小的1.5倍到2倍。Word 和其它的文本编辑软件里， 一般设定字体的120%作为缺省的行间距。css里的 line- height 设定，是均分后加在每一行的上下，也就是说，如果 line-height 设定为 20px 的话，那么每一行文字的上下各有10px的间距。 我们来看一下面这张图片: 可以看到两者的行间距发生了明显的变化，在字体大小相同的情况下，行高数值越大，行间距就越大,反之，数值越小，行间距也越小。由此：我们可以知道行间距=字体大小* 行高. 四、行的长度 Duchnicky和Kolers， 1983；Dyson 和Kipping, 1998: 当行的长度比较大时（每行80-100个字符），网上的文本内容阅读起来要快一些 Dyson和Haselgrove(2001): 每行55个字符在阅读时要比每行100个或25个字符快。 Grabinger和Osman-Jouchoux（1996）: 行的长度应该在45 到60个字符之间 Bernard、Fernandez、Hull和Chaparro（2003） 发现成年人更喜欢中等长度的行长（每行76个字符），而对于儿童来说，相比于每行132个字符，他们更喜欢较短的行长（每行45个字符）。