How to remove this space among the pictures?如何删除图片之间的这个空间？ CSS
我正在学习创建一个画廊，但我无法删除图片之间的空间，我该怎么办？
代码：
body {
background: #E6E6E6;
}<body class="imagens">
<img src="imagens/imagem1.png">
<img src="imagens/imagem2.png">
<img src="imagens/imagem3.png">
<img src="imagens/imagem4.png">
<img src="imagens/imagem5.png">
</body>最简单的修补程序将设置以下CSS属性
虽然我不建议在body元素使用该修复
.container{
background: #E6E6E6;
font-size:0px;
}
问题原因：来源：here
因为白色空间是内联元素显著。如果你想让它们排列起来，你总是可以漂浮你的图片。
由于图像之间存在一个输入，所以出现这个问题！
.container {
background: #E6E6E6;
font-size: 0px;
}<body class="imagens">
<div class="container">
<img src="http://via.placeholder.com/350x150">
<img src="http://via.placeholder.com/350x150">
<img src="http://via.placeholder.com/350x150">
<img src="http://via.placeholder.com/350x150">
<img src="http://via.placeholder.com/350x150">
</div>
</body>图像之间的空间是由于在源代码中的<img>元件之间的空格。默认情况下，<img>元素的CSS display属性设置为inline，并且在常规文本中充当表情符号（如果您在它们之间留出空间，它们之间将留有空间;如果您不在它们之间留下空间，他们之间没有任何空间）。
所以HTML的方法来解决这个问题是除去元素之间的所有空格字符：
<body class="imagens">
<img src="http://via.placeholder.com/350x150"><img src="http://via.placeholder.com/350x150"><img src="http://via.placeholder.com/350x150"><img src="http://via.placeholder.com/350x150"><img src="http://via.placeholder.com/350x150">
</body>
一个CSS的办法可能是沿着这些线路适用的东西：
.imagens {
overflow: hidden;
}
.imagens img {
float: left;
}
你可以使用float。
.clearfix::after, .container::after {
content: " "; /* Older browser do not support empty content */
visibility: hidden;
display: block;
height: 0;
clear: both;
}
.images img {
float: left;
}<div class="images clearfix">
<img src="http://via.placeholder.com/150x150">
<img src="http://via.placeholder.com/150x150">
<img src="http://via.placeholder.com/150x150">
<img src="http://via.placeholder.com/150x150">
<img src="http://via.placeholder.com/150x150">
<img src="http://via.placeholder.com/150x150">
<img src="http://via.placeholder.com/150x150">
<img src="http://via.placeholder.com/150x150">
</div>您可以使用float: left，使他们display: block。不需要为别的......
img {
display: block;
float: left;
}<div>
<img src="http://placehold.it/120x120">
<img src="http://placehold.it/120x120">
<img src="http://placehold.it/120x120">
<img src="http://placehold.it/120x120">
<img src="http://placehold.it/120x120">
</div>可以使用HTML注释用一个小黑客为间隔的元素之间：
<img src="imagens/imagem1.png"><!--
--><img src="imagens/imagem2.png"><!--
--><img src="imagens/imagem3.png"><!--
--><img src="imagens/imagem4.png"><!--
--><img src="imagens/imagem5.png">
@Marco这是否回答对您有帮助？ –