大家好。我的基本 HTML 代码有问题。我的任务是组合 4 个没有可见边距的图片部分。我只允许使用没有 CSS 元素的 HTML 代码，而且我必须使用表格。 我的问题是我无法摆脱行之间的空间。我缩小了边框间距来自 webkit 浏览器表格样式表。有没有办法仅使用 HTML 代码来删除此间距。 忘了说图片尺寸是 3 - 200px x 200px 和 1- 600px x 200px
Chrome 调试器显示额外的 4px 是从表格样式表继承的
table {
display: table;
border-collapse: separate;
border-spacing: 2px;
-webkit-border-horizontal-spacing: 2px;
-webkit-border-vertical-spacing: 2px;
border-color: gray;
}
附言如果我设置图片高度=“100%”和宽度=“100%”比我实现我的目标，但我不确定这是一个正确的方法来做到这一点。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>LR1</title>
</head>
<body>
<!--Using table without CSS-->
<table bgcolor="green" border="0px" cellpadding="0px" cellspacing="0px">
<tbody>
<tr>
<td ><img src="p_01.jpg" alt="Part 1" width="200px" height="200px"></td>
<td ><img src="p_02.jpg" alt="Part 2" width="200px" height="200px"></td>
<td ><img src="p_03.jpg" alt="Part 3" width="200px" height="200px"></td>
</tr>
<tr >
<td colspan="3">
<a href="http://en.wikipedia.org/wiki/Swan" target="_blank"><img src="p_04.jpg" alt="Part 4" width="600px" height="200px">
</a>
</td>
</tr>
</tbody>
</table>
</body>
</html>
最佳答案
我发现解决问题的唯一方法是在图像中添加 style="display: block"。 display: inline 默认情况下会向单元格添加额外的空间。
关于HTML - 从表格行中删除多余的像素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28864328/