colgroup与col标签

该文章由 leevare 发布于 ,归类于 HTML/CSS

在写table表格时,如果表格的列比较多,但是又想给不同的列设置不同的样式时,使用<colgroup><col>标签将是一个最佳的选择。

如下所示:

<table>
    <colgroup>
        <col span="2" style="background-color: yellow">
    </colgroup>
    <thead>
    <tr>
        <th>序号</th>
        <th>标题</th>
        <th>时间</th>
    </tr>
    <tr>
        <td>1</td>
        <td>测试标题</td>
        <td>2018-04-03 15:56:35</td>
    </tr>
    <tr>
        <td>1</td>
        <td>测试标题</td>
        <td>2018-04-03 15:56:35</td>
    </tr>
    <tr>
        <td>1</td>
        <td>测试标题</td>
        <td>2018-04-03 15:56:35</td>
    </tr>
    </thead>
</table>

这段代码就给表格的前两列设置的黄色的背景色,通过<colgroup>标签中嵌套<col>标签就可以设置表格列的样式,这样就避免了每次都要重复给单列写不同的样式。<col>标签的一些属性,可以参看http://www.w3school.com.cn/tags/tag_colgroup.asp。

如果觉得我的文章对您有用,请您随意打赏。您的支持将鼓励我更加努力创作!

相关文章:

说点什么

avatar
300
  Subscribe  
提醒