H2转换不起作用答案

【问题标题】：H2 conversion not workingH2转换不起作用
【发布时间】：2026-01-11 15:55:01
【问题描述】：

我正在尝试转换元素。字体大小转换工作正常，但边距转换效果不佳。

这是我的尝试：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
<html>
    <head>
    <style type="text/css">
    .box{
        font-size:30px;
        margin:23px 0;
        font-weight:bold;

    }
    </style>
    </head>

<body>

</head>
<body>

<div class="box">Some text here</div>

</body>
</html>

相比：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
<html>
    <head>
    <style type="text/css">
    body{
        font-size:20px;
    }
    </style>
    </head>

<body>

</head>
<body>

<h2>Some text here</h2>

</body>
</html>

如您所见，在浏览器中查看时，H2 和 .box 文本具有相同的字体大小。

这是不正确的，应该是 24 像素。我犯了什么错误？

【问题讨论】：

为什么要24px？您的计算是正确的，0.75em 等于 22.5px 您可以只使用 .77em (23/30) 来确保浏览器不会向下舍入。
在浏览器中查看时，H2 和 .box 中的文本并没有完全对齐 - 它们相差 1px，这听起来没什么大不了，但我需要它完全一致一样的。

标签： html css xhtml pixel em

【解决方案1】：

div 元素的margin 属性默认在所有浏览器中预设，而font-size 属性则不是。要覆盖它，你需要更具体，使用这个：

div.box { font-size:30px; margin:23px 0; font-weight:bold; }

【讨论】：

【解决方案2】：

您为 body 设置其他元素将继承的字体大小，但 h2 由浏览器在内部由用户代理 css 预设，具体而言，如“特异性”，并优先于您为 body 设置的字体大小。

例如，如果您使用 Firebug，您会看到浏览器已经在您的浏览器中将 h2 设置为某个值。如果你想改变它，你需要指定h2{font-size: 24px}，就像你在另一个div示例中所做的那样。浏览器没有为 Div 设置字体大小。

【讨论】：