我如何删除这个多余的跨度高度？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了我如何删除这个多余的跨度高度？相关的知识，希望对你有一定的参考价值。
我只是偶然发现了这个问题，即<span>的高度比我还设置字体大小。这里是：
span {
font-size: 36px;
padding: 0px;
line-height: 1;
background:red;
}<span>Hello world</span>即使line-height: 1和padding: 0px跨度似乎获得额外的4个像素的高度。我注意到，display: block解决了这个问题，但在我的情况，这不是一件实事，因为我需要它内联。
有什么“窍门”这将做到这一点？
答案
尝试display: inline-block;
span {
font-size: 36px;
padding: 0px;
line-height: 1;
background: red;
display: inline-block;
}
span.last {
display: inline;
}<span>Hello world (inline-block)</span> <span class="last">Hello world (inline)</span>另一答案
你可以不喜欢这样使用CSS，使用百分比line-height。当你的字体有额外的顶部，并与总25%的底部空间，所以我给了75% line-height
span {
font-size: 36px;
padding: 0px;
background: red;
line-height: 75%;
display: inline-block;
}<span>Hello world</span>以上是关于我如何删除这个多余的跨度高度？的主要内容，如果未能解决你的问题，请参考以下文章