首頁 > web前端 > css教學 > 如何使用 CSS 設定表格列寬?

如何使用 CSS 設定表格列寬?

Mary-Kate Olsen
發布: 2024-10-31 13:09:02
原創
869 人瀏覽過

How to Set Table Column Width Using CSS?

設定表格列寬

表格通常用於呈現表格數據,但調整列寬對於確保可讀性和可用性至關重要正確對齊。在本文中,我們將探討如何使用 CSS 設定表格列的寬度。

使用 CSS 寬度屬性的方法

表格列的寬度可以使用 col 元素的 width 屬性來設定。寬度值可以以像素為單位指定(例如 width: 200px;),也可以指定為父元素寬度的百分比(例如 width: 50%;)。

使用內聯樣式屬性的範例:

此範例使用col 元素內的內聯樣式屬性來設定三列的寬度:

<code class="html"><table style="width: 100%;">
    <colgroup>
        <col span="1" style="width: 15%;">
        <col span="1" style="width: 70%;">
        <col span="1" style="width: 15%;">
    </colgroup>

    <!--- ... remaining table elements ---->
</table></code>
登入後複製

以上是如何使用 CSS 設定表格列寬?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板