有人问了一个非常相似的问题here https://stackoverflow.com/questions/13701110/css-remove-line-height-leading-on-larger-text但确实回答得足够了......
CSS line-height 属性控制字母上方的空白量。使其变大/变小,可以使文本行距离更远/更近。但是,如果将行高设置为与字体大小完全相同的值,文本上方仍然会有空白。
所以这不太管用......
div { height: 80px; }
span { font-size : 80px; line-height : 80px; }
<div>
<span>Foo</span>
</div>
http://jsfiddle.net/s_d_p/yMHVs/ http://jsfiddle.net/s_d_p/yMHVs/
所包含的文本与容器高度的实际匹配程度似乎因字体而异。
所以我的问题分为两部分:
当我们设置行高时,我们实际上在调整什么?
有没有办法将其完全移除,以便字母精确地放入容器内?
请注意,剩余/额外空间通常是所使用字体的症状,由其设计者指定。
因此,80px 包括上面和/或下面分配的空白区域。上面的额外空白通常是为了允许重音字符而提供的,否则需要压缩字母本身,从而产生不一致的字体。
See here https://stackoverflow.com/questions/20119878/how-to-remove-space-at-top-of-p-tag-align-contained-text-to-top-of-container & 此处了解更多信息 https://stackoverflow.com/questions/20244305/why-browsers-reserve-space-for-accented-characters-even-if-there-is-not-one.
行高是指字体的总高度,包括任何分配的空白。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)