表格 |
描述 |
<colgroup> |
定义表格列的组。 |
<col> |
定义用于表格列的属性。 |
- <colgroup> 标签用来定义表中的一组列表。
属性 |
描述 |
span |
此属性包含一个正整数,指示 <colgroup> 元素跨越的连续列数。如果不存在,则其默认值为 1。 |
- 如果 <colgroup> 中有一个或多个 <col> 元素,则不允许使用 span 属性。
- <col> 标签定义表格中的列,并用于定义所有公共单元格上的公共语义。它通常位于<colgroup>元素内
属性 |
描述 |
span |
该属性值为一个正整数,表示该 <col> 元素横跨的列数。默认值为 1 |
- HTML中可以为每个 <tr> 进行分组,区别于普通表格只能对行进行操作,<colgroup> 和 <col> 可以对表格的每列的属性进行设置
示例
<!DOCTYPE html> <html lang="en">
<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <style> table, th, td, tr, caption { border: 1px solid black; } </style>
<body> <table> <caption>Superheros and sidekicks</caption> <colgroup> <col style="background-color: pink;"> <col span="2" class="batman"> <col span="2" class="flash"> </colgroup> <tr> <td> </td> <th scope="col">Batman</th> <th scope="col">Robin</th> <th scope="col">The Flash</th> <th scope="col">Kid Flash</th> </tr> <tr> <th scope="row">Skill</th> <td>Smarts</td> <td>Dex, acrobat</td> <td>Super speed</td> <td>Super speed</td> </tr> </table> </body>
</html> |
浏览器运行结果如下: