Question

我正在垂直放置图像。我希望他们互相嘲笑，但我在他们之间得到一个空白。我如何摆脱这条线？我试过margin = 0px。我也试过不把它们放在div中。

（下图来自W3编辑器）

<div>
    <img border="0" src="/images/pulpit.jpg" width="304" height="228" style = "margin:0px;">
</div>
<div>
    <img border="0" src="/images/pulpit.jpg" width="304" height="228" style = "margin:0px;">
</div>

Answer 1

添加css属性display:block应该可以解决问题。我还删除了填充和边距以消除任何其他样式。所有样式都应该移动到CSS bock而不是内联。

img {
  padding: 0;
  margin: 0;
  display: block;
}

<div>
  <img border="0" src="https://dummyimage.com/200x100/1ff/100">
</div>
<div>
  <img border="0" src="https://dummyimage.com/200x100/100/1ff">
</div>

Answer 2

这样做。如果您使用表格来显示图像，它会起作用。

<style type="text/css">

table
{
border-collapse: collapse; /* 'cellspacing' equivalent */
}
table tr,
table td
{
padding:0;
}
</style>

<table>
<tr>
<td>
<img src="side1.jpg" />

</td>
</tr>
<tr>
<td>    
<img src="side2.jpg" />
</td>
</tr>
</table>

它适用于垂直和水平图像。就像一个谜题。问候。

html：垂直放置img，之间没有空格

2 个答案: