Html 表格单元格未正确放入行中

前言：表格布局/旧html将用于电子邮件时事通讯

我正在用一个表构建一个简单的导航。我要找的是一个650px宽的表格，标题行是横幅，然后在标题行下方等距放置六个单元格，用于导航链接。现在，第二行有一个非常长的单元格，带有“ABOUT”链接，接下来的五个单元格位于表的右侧。只有当我在最上面一行有一个图像时，它才会这样做

代码：

#容器{
背景色：#EFEF；
宽度：650px；
}
#行导航{
宽度：650px；
}
.导航链接{
宽度：108px；
背景色：#AB2328；
}

---

任何帮助都将不胜感激

您需要像这样使用colspan：

<tr>
    <td colspan="6">
        <a href="#"><img src="banner.jpg"/></a>
    </td>
</tr>

---

其中6等于其下行中的列数。

另一种解决方法是定义两个单独的表，如下所示：

<table id = "header" align="center">
    <tr>
        <td>
            <a href="#"><img src="banner.jpg"/></a>
        </td>
    </tr>
</table>

<table id = "container" align="center">
<tr id = "row_nav">
        <td class = "nav_link">
            <a href="">ABOUT</a>
        </td>
        <td class = "nav_link">
            <a href="">AGENDA</a>
        </td>
        <td class = "nav_link">
            <a href="">SPEAKERS</a>
        </td>
        <td class = "nav_link">
            <a href="">SPONSORS</a>
        </td>
        <td class = "nav_link">
            <a href="">TRAVEL</a>
        </td>
        <td class = "nav_link">
            <a href="">REGISTER</a>
        </td>
    </tr>
</table>

---

虽然这看起来需要做更多的工作，但如果您决定为表格添加更多CSS，它不会影响标题表格。

更具体地说，为了解释发生了什么，表格定义了6个表格数据段，因此，它试图将顶部部分的图像塞进一个表数据部分，因此其他所有内容都会错误地扭曲。使用colspan可以使用所有六个表数据段。是的，谢谢您的添加。我发现了一张图片，可以直观地解释正在发生的事情：谢谢！我完全忘了科尔斯潘。

<table id = "header" align="center">
    <tr>
        <td>
            <a href="#"><img src="banner.jpg"/></a>
        </td>
    </tr>
</table>

<table id = "container" align="center">
<tr id = "row_nav">
        <td class = "nav_link">
            <a href="">ABOUT</a>
        </td>
        <td class = "nav_link">
            <a href="">AGENDA</a>
        </td>
        <td class = "nav_link">
            <a href="">SPEAKERS</a>
        </td>
        <td class = "nav_link">
            <a href="">SPONSORS</a>
        </td>
        <td class = "nav_link">
            <a href="">TRAVEL</a>
        </td>
        <td class = "nav_link">
            <a href="">REGISTER</a>
        </td>
    </tr>
</table>