HTML <colgroup> 标签

  • <colgroup>标签定义和用法

    <colgroup>标签指定表中一个或多个列的组以进行格式化。 <colgroup>标签对于将样式应用于整个列非常有用,而不是为每一行重复每个单元格的样式。 注意<colgroup>标签必须是<table>元素的子元素,在任何<caption>元素之后和任何<thead><tbody><tfoot><tr>元素之前。 提示:要为<colgroup>中的列定义不同的属性,请使用标签内的<col>标签。
  • <colgroup>浏览器支持

    Internet Explorer/Edge Chrome FireFox Safari Opera
    支持 支持 支持 支持 支持
  • <colgroup>实例

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    table, th, td {
        border: 1px solid black;
    }
    </style>
    </head>
    <body>
    
    <table>
      <colgroup>
        <col style="background-color:red">
        <col style="background-color:yellow">
        <col style="background-color:green">
      </colgroup>
      <tr>
        <th>书号</th>
        <th>书名</th>
        <th>金额</th>
      </tr>
      <tr>
        <td>3476896</td>
        <td>Java教程</td>
        <td>$53</td>
      </tr>
    </table>
    
    </body>
    </html>
    
    尝试一下
  • <colgroup>HTML4.01和HTML5之间的差异

    HTML5中不支持HTML 4.01中的大多数属性。
  • <colgroup>属性值

    属性名 属性值 描述
    align left right center justify char HTML5不支持。 将内容对齐到列组中
    char character HTML5不支持。 将列组中的内容对齐到字符
    charoff number HTML5不支持。 设置内容将与char属性指定的字符对齐的字符数
    span number 指定列组应该跨越的列数
    valign top middle bottom baseline HTML5不支持。 垂直对齐列组中的内容
    width pixels % relative_length HTML5不支持。 指定列组的宽度
  • <colgroup>全局属性

    <colgroup>标签还支持全局属性。 查看有关全局属性的更多知识。
  • <colgroup>事件属性

    <colgroup>标签还支持事件属性。 查看有关事件属性的更多知识。
  • <colgroup>默认CSS设置

    colgroup { 
        display: table-column-group;
    }