走刀口

使用表格来布局图片的确很方便，首先划分好几行几列，然后在每个单元格中添加图片，表格默认属性是有表格边框的，所以要让图片看来连在一起可以设置以下属性，去掉边框。
[php]
<table border="0" cellpadding="0" cellspacing="0" >
<tr>
<td><img src="a.jpg" height="50" width="100"/></td>
<td><img src="b.jpg" height="50" width="100"/></td>
<td><img src="c.jpg" height="50" width="100"/></td>
</tr>
</table>
[/php]

若表格下一行的三张图片的宽度跟上一行的宽度不一致，那么添加第二行图片的时候会让第一行的图片产生间隙。
[php]
<table border="0" cellpadding="0" cellspacing="0" >
<tr>
<td><img src="a.jpg" height="50" width="100"/></td>
<td><img src="b.jpg" height="50" width="100"/></td>
<td><img src="c.jpg" height="50" width="100"/></td>
</tr>
<tr>
<td><img src="d.jpg" height="50" width="50"/></td>
<td><img src="e.jpg" height="50" width="120"/></td>
<td><img src="f.jpg" height="50" width="130"/></td>
</tr>
</table>
[/php]

要解决这种问题，可以将第二行的图片排列方式改变，合并单元格，然后紧密排列图片。
[php]
<table border="0" cellpadding="0" cellspacing="0" >
<tr>
<td><img src="a.jpg" height="50" width="100"/></td>
<td><img src="b.jpg" height="50" width="100"/></td>
<td><img src="c.jpg" height="50" width="100"/></td>
</tr>
<tr>
<td colspan="3">
<img src="d.jpg" height="50" width="50"/>
<img src="e.jpg" height="50" width="120"/>
<img src="f.jpg" height="50" width="130"/>
</td>
</tr>
</table>
[/php]

但是这样仍然会出现间隙，这个时候只要给图片设置统一的部局就行了，加上
[php]
vertical-align: bottom;
[/php]
或者
[php]
vertical-align: top;
[/php]
代码如下：
[php]
<table border="0" cellpadding="0" cellspacing="0" >
<tr>
<td><img src="a.jpg" height="50" width="100"/></td>
<td><img src="b.jpg" height="50" width="100"/></td>
<td><img src="c.jpg" height="50" width="100"/></td>
</tr>
<tr>
<td colspan="3">
<img src="d.jpg" height="50" width="50" style="vertical-align:bottom;"/>
<img src="e.jpg" height="50" width="120" style="vertical-align:bottom;"/>
<img src="f.jpg" height="50" width="130" style="vertical-align:bottom;"/>
</td>
</tr>
</table>
[/php]

这样写在IE6下可能也会出现间隙，解决办法是将这些图片标签紧密连接在一起
[php]
<img src="" /><img src="" /><img src="" />
[/php]

最终代码如下：
[php]
<table border="0" cellpadding="0" cellspacing="0" >
<tr>
<td><img src="a.jpg" height="50" width="100"/></td>
<td><img src="b.jpg" height="50" width="100"/></td>
<td><img src="c.jpg" height="50" width="100"/></td>
</tr>
<tr>
<td colspan="3"><img src="d.jpg" height="50" width="50" style="vertical-align:bottom;"/><img src="e.jpg" height="50" width="120" style="vertical-align:bottom;"/><img src="f.jpg" height="50" width="130" style="vertical-align:bottom;"/>
</td>
</tr>
</table>
[/php]