网站字体、字号及行高的默认设置分析

字体分析

先让我们看看各大网站的默认字体

body{font-family:宋体,serif;}
body{font-size:12px;line-height:22px;font-family:"宋体","Arial}
body{font:12px/20px arial, verdana, tahoma, simsun, sans-serif;word-break:break-all;word-wrap:break-word;}
body{font-size:12px;line-height:1.25;font-family:Tahoma,sans-serif;}

统计来主要字号基本都是12px 行高基本都是在20px左右。
字体方面 门户网站基本肯定是要把宋体,设置成第一字体的,其它的娱乐性网站好想就没这个固定要求默认以arial与tahoma为主。
过去我在的公司统一改了一次默认字体都改成了tahoma,那时不咋清楚为啥,今天就来分析一下不同字号、字体及行高之间的区别。

字体问题

一、Tahoma的字体
1、所有游览器里,下划线都会紧贴中文字。
2、13px ie6中文非常难看。
3、 中英文混排问题,下划线也会出现错位。
二、Arial的字体
1、同样也存在下划线的粘贴问题。
2、13px字 依然很难看。
3、 中英文混排问题,下划线也会出现错位。
三、宋体的字体
1、Opera 下,只认 “宋体”, 不认 SimSun
Opera 下,只认 “宋体”, 不认 SimSun. font: 12px ‘宋体’, ‘微软雅黑’;
Opera 下,只认 “宋体”, 不认 SimSun. font: 12px SimSun, ‘微软雅黑’;
为了避免编码问题,推荐用:font: 12px \5b8b\4f53, ‘微软雅黑’;
2、宋体自带的英文和标点很难看,中英混排效果不好。

font: 12px arial; 此时,Opera 默认中文字体就是宋体。
font: 12px sans-serif; 此时,Opera 默认中文字体就是宋体。
font: 12px tahoma,arial,simsun,sans-serif; 对于'宋体'来说,如果后面已经没有中文字体,用 simsun 还是 ok 的。

行高问题

font: 12px/1 \5b8b\4f53; 行高为 1 时,IE6-7 下,高度不够时,会导致中文上下显示不全。
font: 12px/1.5 \5b8b\4f53; 行高为 1.5 时,一切正常。

GB编码问题

font: 12px sans-serif; 不设置宋体,页面为 GB 系列编码时,非中文操作系统下,IE 的默认字体是 Microsoft Sans Serif Regular, 很难看。
font: 12px simsun,sans-serif; 不设置宋体,页面为 GB 系列编码时,非中文操作系统下,IE 的默认字体是 Microsoft Sans Serif Regular, 很难看。
font: 12px arial; 可以不写 sans-serif 来避免上面的问题。譬如百度的首页。 测试文字:设置宋体。