行内元素之间会产生间隙bug问题的场景:
当行内元素之间有“回车”、“tab”、“空格”时就会出现间隙。
注:常见的行内元素有:img、span、a、b等
解决方法
- 写在一行,之间不要有空格之类的符号
(不建议,代码混乱,不直观)
<div>
<a>1</a><a>2</a><span>33333</span><span>44444</span><em>555555</em>
</div>
- 父元素设置font-size:0,然后内敛元素上再设置具体的字体大小。
div{font-size:0;}
span{font-size:16px;}
- float浮动
个人认为最直接的方法,当然是在适当的场景中,因为过度的浮动会产生需要清除浮动的必要
如有更好的方法欢迎大家留言,谢谢~~~