Html H1-H6 标签最常见的字体大小是什么
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6140430/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What are the most common font-sizes for H1-H6 tags
提问by rsturim
I've always been unsure of where to start as a general best practice baseline. Yes, I know it depends on your design -- but what's most common?
我一直不确定从哪里开始作为一般的最佳实践基线。是的,我知道这取决于您的设计——但最常见的是什么?
Here's what I currently have as a starter:
这是我目前作为初学者的:
h1 { font-size: 24px;}
h2 { font-size: 22px;}
h3 { font-size: 18px;}
h4 { font-size: 16px;}
h5 { font-size: 12px;}
h6 { font-size: 10px;}
Yes, we don't use EMs at my current job.
是的,我们目前的工作不使用 EM。
Thanks
谢谢
回答by Donut
It would depend on the browser's default stylesheet. You can view an (unofficial) table of CSS2.1 User Agent stylesheet defaults here.
这将取决于浏览器的默认样式表。您可以在此处查看CSS2.1 用户代理样式表默认值的(非官方)表格。
Based on the page listed above, the default sizes look something like this:
根据上面列出的页面,默认尺寸如下所示:
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
Also worth taking a look at is the default stylesheet for HTML 4. The W3C recommends using these styles as the default. An abridged excerpt:
同样值得一看的是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; }
Hope this information is helpful.
希望这些信息有帮助。
回答by Sujit Agarwal
Headings are normally bold-faced; that has been turned off for this demonstration of size correspondence. MSIE and Opera interpret these sizes the same, but note that Gecko browsers and Chrome interpret Heading 6 as 11 pixels instead of 10 pixels/font size 1, and Heading 3 as 19 pixels instead of 18 pixels/font size 4 (though it's difficult to tell the difference even in a direct comparison and impossible in use). It seems Gecko also limits text to no smaller than 10 pixels.
标题通常是粗体;已关闭此大小对应的演示。MSIE 和 Opera 将这些尺寸解释为相同,但请注意 Gecko 浏览器和 Chrome 将标题 6 解释为 11 像素而不是 10 像素/字体大小 1,将标题 3 解释为 19 像素而不是 18 像素/字体大小 4(尽管很难即使在直接比较中也能分辨出差异并且在使用中是不可能的)。似乎 Gecko 还将文本限制为不小于 10 像素。