在开发中遇到了这样一个问题: 某一部分文字的 font-size 并不是我所规定的值,但当我给文字所在的 span 加上 float 或者设置 position: absolute 后,有回归了我设定的大小,具体如下:
基础HTML结构:
<p class="order-footer">
<span>打折金额:</span>
<span>62.80</span>
</p>
在chrome调试中看到如下:(图一是p的总样式,图二是内部span的样式)
可以看到我只设定了body
的20px以及order-footer
的28px,但实际作用的是33.8361px,设置过!important
也不起作用。
以上情况在我给span
添加了float:left
或者position: absolute
后就回复了28px的实际效果。
现在想知道还会有什么不常见的原因可能造成这种影响
补充1:目前通过设置display: inline-block
来解决了这个问题;
补充2:根据 @JustGo 所说,经测试如下图所示:
一旦把框中的那行font-size
取消掉,字体大小就正常了,一点选中,即使并没有生效(可以看到我在上方给覆盖了),可字体大小依然变成了诡异的33.8361px。不明白这其中的原理。
Add max-height:99999px to the parent of the text;