css行内元素之间的空白问题解决

有时行内块元素来做横向导航,这样就不用再去担心浮动块级元素带来的不必要影响。但行内元素,行内元素元素有个硬伤--有默认的间隙



 
    
行内 行内 行内

结果:css行内元素之间的空白问题解决_第1张图片

 原因:由于行内块标签之间的空格和回车和换行造成的

 解决方法:

1.不要加空格或换行



 
    
行内行内行内

2.右边的盒子加margin-left(不推荐)



 
    
行内 行内 行内

3.把父级font-size设置为0,给子元素重新设置font-size(推荐)



 
    
行内 行内 行内

4.把子元素设置浮动,注意给父元素清除浮动防止父元素高度塌陷



 
    
行内 行内 行内

你可能感兴趣的:(html,css,前端,javascript)