1

我想为一个网站创建一个样式指南,并说我有一个 h1 我总是希望在下一个文本之前有 28px 的下边距,无论它是什么,从字母的底部到下一个字母的顶部。问题是在 HTML 中,如果 line-height 总是添加一些额外的间距,并且每个文本可能会有所不同。是否有规则可以准确地知道要使用多少 margin-bottom,例如它总是 28px?

<h1>HL1: Meine Bestellungen</h1>
<h2>SL1: Bestellnr. 1234563</h2>


h1 {
    background: none repeat scroll 0 0 rgb(255, 255, 0);
    color: rgb(153, 145, 141);
    font-family: Georgia;
    font-size: 26px;
    font-weight: normal;
    letter-spacing: 0;
    line-height: 30px;
    margin-bottom: 28px;
    text-decoration: none;
    text-transform: uppercase;
}


h2 {
    background: none repeat scroll 0 0 rgb(0, 255, 0);
    color: rgb(196, 18, 47);
    font-family: Lucida Sans;
    font-size: 12px;
    font-weight: normal;
    letter-spacing: 0.1em;
    line-height: 20px;
    margin-bottom: 6px;
    text-decoration: none;
    text-transform: uppercase;
}

谢谢!

4

1 回答 1

1

它与行高无关,与浏览器默认值有关。

例如,在我的 Google Chrome 版本中,默认情况下margin-top应用了一个值h2。您应该只指定所有边距:

h1 {
    margin: 0 0 28px; /* shorthand notation */
}
h2 {
    margin: 0 0 6px;
}

查看“CSS 重置”,在 jsFiddle 中您可以检查“标准化 CSS”选项。

资源:

于 2013-08-13T16:14:29.740 回答