代码之家 › 专栏 › 技术社区 › LukLed

使用<col width=“x*”/>设置比例列宽

width html-table html

5

LukLed · 技术社区 · 16 年前

<col width="x*" /> :

<table width="600px">
    <col width="1*" />
    <col width="2*" />
    <col width="3*" />
    <tbody>
        <tr>
            <td style="border: 1px solid black;">AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA AAA
            </td>
            <td style="border: 1px solid black;">BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB BBB
            </td>
            <td style="border: 1px solid black;">CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC CCC
            </td>
        </tr>
    </tbody>
</table>

<col>

3 回复 | 直到 9 年前

1

3

carillonator 16 年前

您可以使用17%、34%和49%。1:2:3

2

0

Jan M 14 年前

我试图让它在所有主流浏览器中都能工作,但也失败了。除了官方的规范,谷歌几乎没有提出什么。

3

0

Brendan Gooden 8 年前

你可以用 colgroup .

从…起 WSSchools

标记指定表中一组一列或多列用于格式化。

而不是为每个单元格、每行重复样式。

table {
   width: 100%;
}
td {
   text-align: center;
}

    <table>
        <colgroup>
            <col span="1" style="width: 15%;">
            <col span="1" style="width: 15%;">
            <col span="1" style="width: 70%;">
        </colgroup>
        <thead>
            <tr>
                <th class="col_3">On stop credit</th>
                <th class="col_3">Rating</th>
                <th class="col_3">Customer Notes</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Value</td>
                <td>Value</td>
                <td>Long text value</td>
            </tr>
        </tbody>
    </table>