HTML表格宽度高度

本页内容
上一节: HTML表格边框 下一节: HTML表头

HTML 表格的每一列、每一行或整个表格都可以有不同的大小。

使用 style 带有 width height 属性的属性来指定表、行或列的大小。

HTML表格的丰富性

要设置表格的宽度,请将 style 属性添加到 <table> 元素:


示例

将表格的宽度设置为 100%:

<table style="width:100%">  <tr>    <th>Firstname</th>     <th>Lastname</th>     <th>Age</th>   </tr>  <tr>    <td>Jill</td>     <td>Smith</td>     <td>50</td>   </tr>  <tr>    <td>Eve</td>     <td>Jackson</td>     <td>94</td>   </tr></table>

注意:使用百分比作为宽度的大小单位意味着该元素与其父元素(在本例中为 <body> 元素)相比的宽度。

HTML 表格列宽

要设置特定列的大小,请在or 元素上添加' style 属性: <th> ' <td>


示例

将第一列的宽度设置为 70%:

<table style="width:100%">
    <tr>
        <th style="width:70%">Firstname</th>
        <th>Lastname</th>
        <th>Age</th>
    </tr>
    <tr>
        <td>Jill</td>
        <td>Smith</td>
        <td>50</td>
    </tr>
    <tr>
        <td>Eve</td>
        <td>Jackson</td>
        <td>94</td>
    </tr>
</table>

HTML表格行高

要设置特定行的高度,请 style 在表格行元素上添加属性:


示例

将第二行的高度设置为 200 像素:

<table style="width:100%">
    <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Age</th>
    </tr>
    <tr style="height:200px">
        <td>Jill</td>
        <td>Smith</td>
        <td>50</td>
    </tr>
    <tr>
        <td>Eve</td>
        <td>Jackson</td>
        <td>94</td>
    </tr>
</table>
上一节: HTML表格边框 下一节: HTML表头
此页面最后编辑于2022年8月4日 (星期四) 22:28。