我一直不确定从哪里开始作为一般最佳实践基线。是的,我知道这取决于你的设计 - 但最常见的是什么?
以下是我目前作为首发的内容:
h1 { font-size: 24px;}
h2 { font-size: 22px;}
h3 { font-size: 18px;}
h4 { font-size: 16px;}
h5 { font-size: 12px;}
h6 { font-size: 10px;}
是的,我目前的工作不使用EMs。
由于
答案 0 :(得分:201)
这取决于浏览器的默认样式表。您可以查看CSS2.1用户代理样式表默认值here的(非官方)表。
根据上面列出的页面,默认大小如下所示:
IE7 IE8 FF2 FF3 Opera Safari 3.1
H1 24pt 2em 32px 32px 32px 32px
H2 18pt 1.5em 24px 24px 24px 24px
H3 13.55pt 1.17em 18.7333px 18.7167px 18px 19px
H4 n/a n/a n/a n/a n/a n/a
H5 10pt 0.83em 13.2667px 13.2833px 13px 13px
H6 7.55pt 0.67em 10.7333px 10.7167px 10px 11px
另外值得一看的是default stylesheet for HTML 4。 W3C建议使用这些样式作为默认值。简略摘录:
h1 { font-size: 2em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.17em; }
h4 { font-size: 1.12em; }
h5 { font-size: .83em; }
h6 { font-size: .75em; }
希望这些信息有用。
答案 1 :(得分:3)
标题通常是大胆的;这个尺寸对应的示范已被关闭。 MSIE和Opera解释这些尺寸相同,但请注意,Gecko浏览器和Chrome将Heading 6解释为11像素而不是10像素/字体大小1,而Heading 3则为19像素而不是18像素/字体大小4(尽管很难即使在直接比较中也无法区分并且无法使用)。似乎Gecko还将文本限制为不小于10像素。