文章介绍了由于行内元素和行内块元素之间的换行被浏览器解析为空白字符的问题，提供了一个解决方案，即通过将父元素的font-size设为0，然后为包含文字的子元素单独设定字体大小来消除空白。代码示例展示了这种方法的应用。
1，产生的原因：行内元素，行内块元素，彼此之间的换行会被浏览器解析为一个空白字符。
2，解决方案：给父元素设置font-size：0，再给需要显示文字的元素，单独设置字体大小。
3，代码演示
<style>
div{
height: 200px;
background-color: gray;
font-size: 0px;
}
span:nth-child(1){
background-color: red;
}
span:nth-child(2){
background-color: orange;
}
span:nth-child(3){
background-color: yellow;
}
span{
font-size: 20px;
}
</style>
</head>
<body>
<div>
<span>人之初</span>
<span>人之初2</span>
<span>人之初3</span>
<hr>
<img src="../images/arrow.png" alt="">
<img src="../images/arrow.png" alt="">
<img src="../images/arrow.png" alt="">
</div>
</body>4，运行结果
717
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
