html - 均匀空间图像？

Question

我想连续有 4 张图像，根据屏幕的宽度均匀分布在行中。我想这样做，这样我就可以在图像之间留出合适的间距，而不会出现任何水平溢出。

Answer 1

假设图像宽度相同，以下布局将根据需要排列图像。

<div>
<div style="width: 25%; text-align: center;"><img src="img1.jpg"></div>
<div style="width: 25%; text-align: center;"><img src="img2.jpg"></div>
<div style="width: 25%; text-align: center;"><img src="img3.jpg"></div>
<div style="width: 25%; text-align: center;"><img src="img4.jpg"></div>
</div>

有一个问题；与中间的差距相比，第一张图片和最后一张图片之后的差距将是一半：

 |  +----+    +----+    +----+    +----+  |
 |--|    |----|    |----|    |----|    |--|
 |  +----+    +----+    +----+    +----+  |

Answer 2

为此使用表格：

<table width="100%">
 <tr>
  <td width="25%">IMAGE</td>
  <td width="25%">IMAGE</td>
  <td width="25%">IMAGE</td>
  <td width="25%">IMAGE</td>
 </tr>
<table>

然后根据需要添加cellpadding和cellspacing