html - 修复表格 td 宽度

Question

我想设计成上面的表格

我是这样实现的。请查看我的JSFiddle .

HTML:

<table border="0" id="cssTable">
    <tr>
        <td>eredgb</td>
        <td><a href="self">04-Milwaukee</a></td>
        <td>705</td>
        <td>sdfdfdfed</td>
        <td>298</td>
    </tr>
    <tr>
        <td>sdfsdfsdfsdfsdf</td>
        <td><a href="self">04-Milwaukee</a></td>
        <td>705</td>
        <td>content2</td>
        <td>298</td>
    </tr>
    <tr>
        <td>sdfsdfsdfsdfsdf</td>
        <td><a href="self">04-Milwaukee edh walkohnykuohbnbd</a></td>
        <td>705</td>
        <td>content1</td>
        <td>298</td>
    </tr>
</table>

CSS:

#cssTable{
    margin-left:20px;
}

我怎样才能像上面的截图一样？我需要为每个表格 td 内容提供相等的间距和一些固定的宽度。

Answer 1

Take a look at this .

您可以使用 css 选择器 :nth-child() 来定位特定列。

#cssTable td {
    padding: 5px 15px;
}

#cssTable td:nth-child(2) {
    width: 100px;
}