无法删除网页切片图像中图像下方的空间答案

【问题标题】：Can't remove space below images in sliced image for webpage无法删除网页切片图像中图像下方的空间
【发布时间】：2017-06-13 15:10:43
【问题描述】：

该页面的链接是westvillenyc.com/super-draft。一排图像下方的那个小黑区真是令人沮丧！我尝试编辑我的样式表和我的 html 代码无济于事。这是我到目前为止的 html 编码：

HTML 编码：

<table class="address_table2" style="height: 341px;" width="700">
<tbody>
<tr>

<td align="center" width="681" height="0"><a href="http://westvillenyc.com/wp-content/uploads/2017/01/SuperBowlHalfPage.jpg" rel="attachment wp-att-21167"><img class="wp-image-21167 aligncenter" src="http://westvillenyc.com/wp-content/uploads/2017/01/1-1024x393.jpg" alt="1" width="681" height="261" /> </a></td>
</tr>

<tr>
<td align="center"><a href="http://westvillenyc.com/wp-content/uploads/2017/01/3.jpg" rel="attachment wp-att-21168"><img class="alignnone wp-image-21168" src="http://westvillenyc.com/wp-content/uploads/2017/01/3.jpg" alt="3" width="212" height="48" /></a><a href="http://westvillenyc.com/wp-content/uploads/2017/01/4.jpg" rel="attachment wp-att-21169"><img class="alignnone wp-image-21169" src="http://westvillenyc.com/wp-content/uploads/2017/01/4.jpg" alt="4" width="148" height="48" /></a><a href="http://westvillenyc.com/wp-content/uploads/2017/01/5.jpg" rel="attachment wp-att-21170"><img class="alignnone wp-image-21170" src="http://westvillenyc.com/wp-content/uploads/2017/01/5.jpg" alt="5" width="144" height="48" /></a><a href="http://westvillenyc.com/wp-content/uploads/2017/01/6.jpg" rel="attachment wp-att-21171"><img class="alignnone wp-image-21171k;" src="http://westvillenyc.com/wp-content/uploads/2017/01/6.jpg" alt="6" width="179" height="48" /></a><a href="http://westvillenyc.com/wp-content/uploads/2017/01/7.jpg" rel="attachment wp-att-21173"><img class="alignnone wp-image-21173" src="http://westvillenyc.com/wp-content/uploads/2017/01/7.jpg" alt="7" width="286" height="76" /></a><a href="http://westvillenyc.com/wp-content/uploads/2017/01/7-2.jpg" rel="attachment wp-att-21172"><img class="alignnone wp-image-21172" src="http://westvillenyc.com/wp-content/uploads/2017/01/7-2.jpg" alt="7 (2)" width="125" height="76" /></a><a href="http://westvillenyc.com/wp-content/uploads/2017/01/9.jpg" rel="attachment wp-att-21174"><img class="alignnone wp-image-21174" src="http://westvillenyc.com/wp-content/uploads/2017/01/9.jpg" alt="9" width="276" height="76" /></a></td>
</tr>
</tbody>
</table>

Css 编码：

.address_table2 {

    display: block; 
    width: 100%;
    margin-top: 0px;
    margin-left: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
    position: relative;
    border-spacing: 0;
    border-collapse: collapse;
}

有什么想法吗？

【问题讨论】：

这是您希望达到的目标吗？ imgur.com/a/tbeBR

标签： html css image html-table spacing

【解决方案1】：

重置顶部图像margin，它将下方的图像向下推。

CSS：

img.wp-image-21167.aligncenter {
  margin: 0;
}

将最后一行图片向上推。

CSS：

img.alignnone.wp-image-21172,
img.alignnone.wp-image-21173,
img.alignnone.wp-image-21174 {
  margin-top: -8px;
}

【讨论】：