html - Chrome中图像侧面的额外边距

Question

<div>
  <img src ='image.png'  style="display: block" />
</div>

在 Chrome 中，这会在图像右侧呈现 1px 的边距并将包装器 div 推出。如何去除边距？

Answer 1

在样式属性中使用边距和内边距，如下所示：

<div>
  <img src ='image.png' style="display: block; margin: 0px; padding: 0px;" />
</div>

除此之外，您还可以通过添加样式来移除边框"border:0px"。

我没试过，让我知道它是否有效。

Answer 2

仅使用 CSS 删除仍然会使您的网站在其他浏览器中看起来不同。最好使用 CSS 重置来在所有浏览器中获得相同的格式。

CSS像这样重置：http: //meyerweb.com/eric/tools/css/reset/

Answer 3

我也在 Safari 中看到了这种行为。尝试这个。

<div class="group-holder" style="display: table;">
  <img src="myimage1.gif" style="display: table-cell;" />
  <img src="myimage1.gif" style="display: table-cell;" />
  <img src="myimage1.gif" style="display: table-cell;" />
</div>

这对我有用。