TD列宽度值不与固定表布局工作

" old " width属性不需要一个单位，它期望类似于width="20"。

然而，定义一个表的"最正确"的方式是这样的:

<table>
    <colgroup>
        <col style="width:20px" />
        <col style="width:50px" span="2" />
        <col style="width:15px" />
        <col style="width:25px" />
        <col style="width:20px" span="3" />
    </colgroup>
    <tbody>
        <tr>
            <td>col1</td>
            <td>col2</td>
            <td>col3</td>
            <td>col4</td>
            <td>col5</td>
            <td>col6</td>
            <td>col7</td>
            <td>col8</td>
        </tr>
    </tbody>
</table>

这对于大的表格特别有效，因为浏览器只需要读取<colgroup>元素就知道整个表格应该如何布局，而不需要根据单个单元格样式计算宽度。

你必须使用:

<td width="20">

或

<td style="width: 20px">

您应该使用属性width而不使用单位px。可能有一些现代浏览器接受带有单位的属性，但不是正确的方式!

你有一个类似的问题在这另一个Stackoverflow的情况:

width属性不支持用px表示td，如果你想用px表示宽度，你需要提供如下的css

<td style="width: 20px">

似乎是我想要的。

.tableStyle{
table-layout:fixed;
margin: 0 auto; width: 960px;
}

建议这样做

<table class="tableStyle">
<tr>
    <td>col1</td>
    <td>col2</td>
    <td>col3</td>
    <td>col4</td>
    <td>col5</td>
    <td>col6</td>
    <td>col7</td>
    <td>col8</td>
</tr>
</table>

.tableStyle{
table-layout:fixed;
margin: 0 auto; width: 960px;
  background: #ddd;
}
td:nth-child(1n) {
  width: 20px;
  background: #876342;
}
td:nth-child(3n+1) {
  width: 100px;
}