HTML <col> 标签 的详细用法

作者 : 开心源码 本文共1124个字,预计阅读时间需要3分钟 发布时间: 2022-05-13 共259人阅读

col 标签的功能

<col> 标签规定了 <colgroup> 元素内部的每一列的列属性。

col 标签的用法

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

<table border="1">  <colgroup>    <col span="2" style="background-color:red">    <col style="background-color:yellow">  </colgroup>  <tr>    <th>学习圈</th>    <th>地址</th>    <th>评分</th>  </tr>  <tr>    <td>专门建立的学习Q-q-u-n</td>    <td>⑦③①-⑦⑦①-②①①</td>    <td>100分</td>  </tr></table>

col 标签的演示

注意:假如您对tr做了background-color设置,会导致 col 的设置失效

<style>
article table tr:nth-child(even){
background-color:transparent;
}
</style>

<colgroup> <col span=”2″ style=”background-color:red”> <col style=”background-color:yellow”> </colgroup>

| 学习圈 | 地址 | 评分 |
| 专门建立的学习Q-q-u-n | ⑦③①-⑦⑦①-②①① | 100分 |


浏览器支持

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


标签定义及使用说明

  • 通过使用 <col> 标签,可以向整个列应用样式,而不需要重复为每个单元格或者每一行设置样式。
  • css 设置的背景色会覆盖当前设置

HTML4 与 HTML5 之间的差异

HTML5 中不再支持 HTML4 中的大部分属性。


HTML 与 XHTML 之间的差异

在 HTML 中,<col> 标签没有结束标签。

在 XHTML 中,<col> 标签必需被正确的关闭。


属性

属性形容
alignleft
right
center
justify
char
HTML5 不支持。规定与 <col> 元素相关的内容的水平对齐方式。
charcharacterHTML5 不支持。规定根据哪个字符来对齐与 <col> 元素相关的内容。
charoffnumberHTML5 不支持。规定第一个对齐字符的偏移量。
spannumber规定 <col> 元素应该横跨的列数。
valigntop
middle
bottom
baseline
HTML5 不支持。规定与 <col> 元素相关的内容的垂直对齐方式。
width%
pixels
relative_length
HTML5 不支持。Specifies the width of a <col> element

全局属性

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


事件属性

<col> 标签支持HTML 事件属性

说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » HTML <col> 标签 的详细用法

发表回复