0

对于同一个 HTML 表，我看到 Firefox 和 Chrome 之间的行为不同。

Firefox：行之间的空间被平均分配。

Chrome：行之间的空间不均等。

有人可以告诉我发生了什么吗？

jsfiddle.net

<html>
    <body>
        <table border="1" width="100%">
            <tr>
                <td rowspan="3">AAA</td>
                <td>BBB</td>
                <td rowspan="3"CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/></td>
            </tr>
            <tr>
                <td>BBB</td>
            </tr>
            <tr>
                <td>BBB</td>
            </tr>
        </table>
    </body>
</html>
4

4 回答 4

1

这是 Chrome/Webkit 浏览器的已知渲染问题。

一位用户在这里提供了一个解决方案：Table cells bad rendering with Google Chrome/Webkit

于 2013-01-31T20:45:01.717 回答
0

有一个类似的问题，我在 Chrome 中的行之间有 1px 的空间，但在其他浏览器中没有。当我在 CSS 中添加以下内容时，它得到了解决。

td{
   padding: 0px 0px;
   position:relative;
}

关键是将 td 设置为“位置：相对”。出于某种原因，它解决了这个问题。在这种情况下，也许同样可以提供帮助。

于 2013-05-20T16:04:48.827 回答
0

您需要通过使用<br/>而不是关闭标签<br>。

在兼容的 XHTML 中，所有标签都需要正确关闭。在这种情况下，不是用 关闭标签</br>，而是使用尾随/来完成。

<br></br>

相当于

<br/>

你会对图像元素做同样的事情：

<img src="..."/>
于 2013-01-31T20:32:55.783 回答
0

如果你关闭第三个怎么办<td... 

<td rowspan="3"CCC
<td rowspan="3">CCC
于 2015-05-30T19:45:25.657 回答