0

我有一个<h1>我用以下样式设置的CSS

#col2 h1 {
    text-align: left;
    padding: 2.5%;
    margin-top: 0;
    margin-bottom: 0;
    width: 95%;
    background-color: #444;
    border-bottom: solid 1px black;
    cursor: pointer;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

由于某种原因,文本显示如下: <h1> 的屏幕截图

我首先猜测这可能是由于我已设置的事实,margin:0;但是当我将其更改为2.5%线之间的距离保持不变时,深灰色区域的顶部出现了一个间隙。

4

2 回答 2

4

指定line-height

h1 {
    line-height: 1.4em; /* or whatever... */
}

尽管在您发布的 CSS 中没有什么会导致这个问题,所以我建议使用浏览器的开发人员工具(F12在大多数浏览器中)来检查line-height它的来源,或者它被覆盖的地方。

顺便说一句margin,块级元素存在于由元素形成的“盒子”的外边缘周围,它不会影响该元素中包含的文本行之间的间距

于 2013-10-07T18:36:40.603 回答
1
line-height:10px; 

尝试增加行高

于 2013-10-07T18:37:26.633 回答