• 首页
  • vue
  • TypeScript
  • JavaScript
  • scss
  • css3
  • html5
  • php
  • MySQL
  • redis
  • jQuery
  • <colgroup>

    HTML 中的表格列组(Column Group<colgroup>)标签用来定义表中的一组列表。

    浏览器支持

    所有主流浏览器都支持<colgroup>标签。

    注意:W3C规范,html5 中支持的属性只有span。用于 css 控制属性只有borderwidthbackgroundvisibility。这些被所有浏览器支持。


    定义和用法

    • <colgroup>标签定义表格列的组。通过此标签,您可以对列进行组合,以便格式化。该元素只有在<table>中才是合法的。<colgroup>元素只能包含 col 元素。
    • <colgroup>元素无法创建表格列。如需创建列,必须在<tr>元素内规定<td>元素。
    • 如果需要为一个或多个列规定属性值,请使用<col>元素。
    • <colgroup>标签,可以向整个列应用样式,而不需要重复为每个单元格或每一行设置样式。
    • 只能在<table>元素之内,在任何一个<caption>元素之后,在任何一个<thead><tbody><tfoot><tr>元素之前使用<colgroup>标签。
    • 如果想对<colgroup>中的某列定义不同的属性,请在<colgroup>标签内使用<col>标签。

    属性

    属性描述
    alignleft
    right
    center
    justify
    char
    HTML5 不支持。规定在列组合中内容的水平对齐方式。
    charcharacterHTML5 不支持。规定根据哪个字符来对齐列组中的内容。
    charoffnumberHTML5 不支持。规定第一个对齐字符的偏移量。
    spannumberHTML5 支持。规定列组应该横跨的列数。
    valigntop
    middle
    bottom
    baseline
    HTML5 不支持。定义在列组合中内容的垂直对齐方式。
    widthpixels
    %
    relative_length
    HTML5 支持。规定列组合的宽度。

    HTML 4.01 与 HTML5之间的差异

    HTML5 中不再支持 HTML 4.01 中的大部分属性。HTML5 中支持的属性只有spanborderwidthbackgroundvisibility

    全局属性

    <colgroup>标签支持HTML 的全局属性。

    事件属性

    <colgroup>标签支持HTML 的事件属性。

    实例

    <table>
      <colgroup span="3" style="color:blue;background-color:red"></colgroup>
      <tr>
    	  <td>1</td>
    	  <td>2</td>
    	  <td>3</td>
    	  <td>4</td>
      </tr>
      <tr>
    	  <td>1</td>
    	  <td>2</td>
    	  <td>3</td>
    	  <td>4</td>
      </tr>
    </table>
    
    1234
    1234

    HTML5 中,css 不支持的属性color,所以字体颜色无效,支持background,所以背景色是灰色。


    <colgroup><col>标签为表格中的三个列设置了背景色:

    <table border="1">
    	<colgroup>
    		<col span="2" style="background-color:red">
    		<col style="background-color:yellow">
    	</colgroup>
    	<tr>
    		<th>isbn</th>
    		<th>title</th>
    		<th>price</th>
    	</tr>
    	<tr>
    		<td>3476896</td>
    		<td>my first html</td>
    		<td>$53</td>
    	</tr>
    </table>
    
    isbntitleprice
    3476896my first html$53

    上篇:<col>

    下篇:<tbody>