Question

我有一个奇怪的问题...当我比较我在服务器上编码的网站上的两个元素与我在其服务器上创建的tumblr网站相比时，存在2px字体大小差异。

这两个网站都有此代码：

<body>
<h1>Text</h1>

我没有设置任何字体大小，但两个正文css代码都是：

body {
    font-family: Arial;
    font-size: 100%;
    color: #000;
    background: #FFF;
    width: 4100px;
    padding: 0;
    margin: 0;
}

并且两个h1代码都是：

h1 {
    font-size: 100%;
    font-weight: normal;
    margin: 0.67em 0 0.67em 0;
}

无论出于何种原因，tumblr网站的字体大小差异为2px（较小）。是否有任何已知原因？

EDIT 我已经为两个html属性添加了16px的基本字体大小，但是似乎仍然存在大约2px的差异。一些链接到源：

服务器： http://goo.gl/PfyQ6r

的tumblr： http://goo.gl/5gDfp4

Answer 1

Tumblr指出AR7的global.css文件设置为14px，大多数浏览器的默认html字体大小为16px，但也是用户可定义的。

html, body {
    font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
    font-weight: 400;
    line-height: 1.4;
    font-size: 14px;
    font-style: normal;
    color: #444;
}

您的问题代码示例将body font-size设置为从其父级（html）继承为100％。如果您未指定html字体大小，则会将浏览器定义的默认字体大小继承为100％。

Answer 2

字体大小默认为16px我相信并且通常在正文中定义。

像bootstrap这样的流行框架在体内将字体大小设置为14px。

这可能是因为默认字体大小是指定100％时使用的原因。 Tumblr自己的css文件与你的文件完全无关，默认情况下将其指定为14px。

tumblr和硬编码之间的字体大小差异

2 个答案: