我无法将图像一起移动。
请参阅附件中我正在努力实现的屏幕截图。
下面的图片行是为了向上移动(1、2、3、4 等)，以便布局正确显示 - 目前它卡在最高图片下方，留下空白。
图片链接:
我正在使用以下 HTML 和 CSS 代码:
div.content-wrapper {
margin: auto;
width: 100%;
height: auto;
display:table-cell;
vertical-align:middle;
text-align:center;
}
table {border-collapse: collapse;
padding:0; margin:0;
border-spacing: 0;}
td {border-collapse: collapse;
padding:0; margin:0;
border-spacing: 0;
vertical-align: text-top;
}
td img {
width: 100%;
height: auto;
vertical-align: text-top;
}
tr {
width: 100%;
height: auto;
display: block;
vertical-align: text-top;
}
img {
max-width: 100%;
height: auto;
}<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="content-wrapper" align="center">
<div class="row">
<img src="images/imosec_01.gif" width="1017" height="343 alt="">
</div>
<table>
<tbody>
<tr>
<td><img src="images/imosec_02.gif" width="197" height="119"></td>
<td><img src="images/imosec_03.gif" width="128" height="138"></td>
<td><img src="images/imosec_04.gif" width="51"></td>
<td><img src="images/imosec_05.gif" width="134" height="159"></td>
<td><img src="images/imosec_06.gif" width="47"></td>
<td><img src="images/imosec_07.gif" width="149" height="201"></td>
<td><img src="images/imosec_08.gif" width="26"></td>
<td><img src="images/imosec_09.gif" width="132" height="138"></td>
<td><img src="images/imosec_10.gif" width="153" height="138"></td>
<td><img src="images/spacer.gif" width="1" height="119" alt=""></td>
</tr>
<tr>
<td><img src="images/imosec_11.gif" width="50"></td>
<td><img src="images/imosec_12.gif" width="147" height="128"/></td>
<td><img src="images/spacer.gif" width="1" height="19" alt=""></td>
</tr>
</div>
</tbody>
</table>
</body>
</html>最佳答案
你的问题不是很清楚，但有一件事是肯定的:你在图像标签末尾的高度后遗漏了一个引号:
<div class="row">
<img src="images/imosec_01.gif" width="1017" height="343" alt="">
</div>
编辑:您关闭 </div>在关闭您的 </table> 之前标记标签。那是不正确的。你应该尊重秩序:
<div>
<table>
...
</table>
</div>
为避免此类问题，请始终在打开标签后立即将其关闭(并在这些标签之间写入内容)。
您是否也尝试过使用 div 而不是 table ？ 您还可以查看 Bootstrap 库，它有助于制作正确的 html/css 代码并且易于使用:https://getbootstrap.com/docs/4.0/getting-started/introduction/
关于html - 将图像直接放在彼此下方 (DIV/CSS)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52146939/