您可以控制 HTML 表 Colgroup 中的文字對齊方式嗎？

HTML 表格Colgroup 中的文字對齊

為了保持表格元素內的一致性，colgroup 經常用於統一樣式中的所有單元格指定的列。雖然 colgroup 可以有效控制背景顏色等方面，但透過此方法仍然無法存取文字對齊。

讓我們考慮以下範例：

<code class="html"><table id="myTable" cellspacing="5">
    <colgroup id="names"></colgroup>
    <colgroup id="col20" class="datacol"></colgroup>
    <colgroup id="col19" class="datacol"></colgroup>
    <colgroup id="col18" class="datacol"></colgroup>

    <thead>
        <th> </th>
        <th>20</th>
        <th>19</th>
        <th>18</th>
    </thead>
    <tbody>
        <tr>
            <td> </td>
            <td> </td>
            <td> </td>
            <td> </td>
        </tr>
    </tbody>
</table></code>

<code class="css">#names {
    width: 200px;
}

#myTable .datacol {
    text-align: center;
    background-color: red;
}</code>

如CSS 程式碼所示，指派" text-align: center」到「datacol」類別不會產生預期的結果。這是因為列的 CSS 屬性適用性有限，不包括文字對齊。

要修正此問題，可以實施以下 CSS 規則：

<code class="css">#myTable tbody td { text-align: center }
#myTable tbody td:first-child { text-align: left }</code>

此調整將所有表格單元集中對齊，但第一列除外，它保持左對齊。值得注意的是，此解決方法與 IE6 不相容，儘管不相容，文字對齊仍錯誤地應用於列。

此外，提供的 HTML 程式碼包含無效的元素結構。 部分缺少所需的

;標籤。

以上是您可以控制 HTML 表 Colgroup 中的文字對齊方式嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！