图像并排,它们之间没有任何空间

cos*_*sti 16 html css image

我有一个图像网格,它们之间有空格.如何删除此空间?

我已经尝试过设置图像paddingmargin图像,0px但它没有用.

有任何想法吗?

Jak*_*ris 31

确保html标记中没有任何空格.所以改变:

<img src="" alt="" /> <img src="" alt="" />
Run Code Online (Sandbox Code Playgroud)

<img src="" alt="" /><img src="" alt="" />
Run Code Online (Sandbox Code Playgroud)

有时空格也可以隐藏在新行的末尾,所以如果你的html看起来一定要检查行的结尾

<img src="" alt="" /> 
<img src="" alt="" />
Run Code Online (Sandbox Code Playgroud)

编辑

而不是写:<img src="imgs/img8.jpg" style="margin: 0; width: 300; height: 300;" />87次,只需将其放在您的css文件中:

div img { margin: 0;
    width: 300px;
    height: 300px;
}
Run Code Online (Sandbox Code Playgroud)

然后你可以简单地制作你的图像 <img src="imgs/img8.jpg" alt="img8" />


小智 18

添加font-size:0px到div,然后您可以继续将img元素保存在单独的代码行上


Ref*_*gee 2

如果您float: left在图像上使用,并用分隔符分隔每一行,clear: both则图像之间不应有空格。