css 如何使行高与字体高度匹配？

ffx8fchx 于 2023-01-18 发布在其他

关注(0)|答案(4)|浏览(129)

我试过将行高设置为1em，但是，字体上下仍然有一些空间（大约3px）：

我怎样才能设置我的网站的行高，使之与字体高度完全相同？
JSF中间文件：http://jsfiddle.net/uovjzrn6/1/
超文本：

Hello, world!

CSS：

body {
    font-size: 18px;
    line-height: 1em;
}

css

来源：https://stackoverflow.com/questions/30722224/how-to-make-line-height-match-font-height

4条答案

按热度按时间

ut6juiuv1#

请参考以下示例div HTML5/CSS3：
超文本标记语言

<div id = "sample">
    Hello, world!
</div>

中央支助系统

body {
    font-size: 18px;
    padding:0;
    margin:0;
}
#sample
{
    height: 18px;
    line-height: 18px;
    background-color: #e0e0e0;
    margin-top:-3px;
}

希望这个能帮上忙。

赞(0）回复(0）举报 2023-01-18

ggazkfy82#

我认为您使用小提琴中所述的line-height: 1（* 无单位 *）做得很好。
如MDN中所述：
使用的值是这个无单位值乘以元素的字体大小。计算的值与指定的值相同。在大多数情况下，这是设置行高的首选方法，在继承的情况下不会产生意外结果。
Working Fiddle

赞(0）回复(0）举报 2023-01-18

gz5pxeao3#

line-height: 0.75;

它拯救了我们。

赞(0）回复(0）举报 2023-01-18

e4yzc0pl4#

margin-top: 0px; margin-bottom: 0px;

应该够了

赞(0）回复(0）举报 2023-01-18

我来回答

css 如何使行高与字体高度匹配？

4条答案

相关问题

热门标签

最新问答