在解决li inline-block化后li之间产生的空白的问题

来源：4-5 页眉页脚样式

qq_功夫小蝇_0

2017-02-13

在解决li inline-block话后li之间产生的空白的问题时，使ul的字号设置成0px，然后再给li设置字体大小，这是产生的父元素被多余的撑开，这是为什么呢？

做了如下测试例子，也会出现该问题，不过可以通过设置li 的vertical-align解决该问题，但是为什么会出现这个问题呢？

<p style="line-height: 48px;background: red;font-size: 0px;">
    <span style="display: inline-block;font-size: 36px; background: green;">123456</span>
 </p>

写回答

1回答

姜维

2017-02-15

空白产生的原因是父元素和子元素之间的非可见字符被赋予尺寸，把父元素字体统一设置为0，这样这些非可见字符的尺寸也就为0了

响应式开发一招致胜

用一套代码开发出不受设备型号、尺寸限制的互联网金融网站

4021 学习 · 752 问题

查看课程

相似问题

换行产生的空白字符

回答 1

关于inline-block与空白块的问题

回答 1

.feature .item h3宽度百分比设置问题

回答 1

请问 CSS Sprites定位的坐标是用什么工具算出来的?

回答 3

inline-block和line-height的问题

回答 1

打开慕课网App查看更多内容