如何忽略标签之间的空白，CSS，PHP

Question

我有两个彼此相邻的div，两者之间有一个空格，即使它们的边距设置为0.我不希望空间在那里。该空间由2个div标签之间的空白区域创建。我想知道是否有一种方法可以在使用css样式时忽略标签之间的空白区域？谢谢。

div { 
 
    width: 100px; 
 
    height: 100px; 
 
    background-color: red; 
 
    border: 1px solid black; 
 
    display: inline-block; 
 
    margin: 0px; 
 
    font-size: 0px; 
 
}

<div></div> <div></div>

Answer 1

你可以一个祖先的字体大小设置为0 ...

.parent { 
 
    font-size: 0; 
 
} 
 

 
div { 
 
    width: 100px; 
 
    height: 100px; 
 
    background-color: red; 
 
    border: 1px solid black; 
 
    display: inline-block; 
 
    margin: 0px; 
 
    font-size: 0px; 
 
}

<span class="parent"> 
 
    <div></div> <div></div> 
 
</span>

Answer 2

不要在CSS，我所知道的，但你可以通过添加它们之间的评论删除HTML中的空白。

<div> 
</div><!-- 
--><div> 
</div> 

这是有效的，因为当页面呈现时，注释标记内的所有内容都会被忽略。

Answer 3

因为你使用display: inline-block;这使得空格显著。要么摆脱空白或摆脱内联显示类型。

您也可以使用浮动。

div { 
 
    width: 100px; 
 
    height: 100px; 
 
    background-color: red; 
 
    border: 1px solid black; 
 
    /*display: inline-block;*/ 
 
    margin: 0px; 
 
    font-size: 0px; 
 
    float: left; 
 
}

<div></div> <div></div>