<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>colgroup</title>

    <style>

        .engine{

            background-color: aquamarine;

        }

    </style>

</head>

<body>

<table border="1">

    <!--列组　-->

    <colgroup>

        <col class="browser">

        <col class="engine" span="2">

    </colgroup>

    <thead>

        <tr>

            <th>浏览器</th>

            <th>渲染引擎</th>

            <th>JavaScript 引擎</th>

        </tr>

    </thead>

    <tbody>

        <tr>

            <th>Chrome</th>

            <td>Blink</td>

            <td>V8</td>

        </tr>

        <tr>

            <th>Opera</th>

            <td>Blink</td>

            <td>V8</td>

        </tr>

        <tr>

            <th>Edge</th>

            <td>EdgeHTML</td>

            <td>Chakra</td>

        </tr>

    </tbody>

</table>

</body>

</html>

效果：

table-列组的更多相关文章

  1. 表格table列宽度控制<colgroup>

    <colgroup> 标签用于对表格中的列进行组合,以便对其进行格式化. 通过使用 <colgroup> 标签,可以向整个列应用样式,而不需要重复为每个单元格或每一行设置样式. ...

  2. table列等宽

    固定table列等宽 固定table列等宽 style: {table-layout : fixed} html: style="table-layout:fixed" js: o ...

  3. 关于如何解决bootstrap table 列 切换 刷新 高度不一样

    在使用bootstrap table时候,碰到bootstrap table 列 切换 刷新 高度不一样的问题,如图所示: 解决这个问题很简单,在你的页头加一句<!DOCTYPE html> ...

  4. bootstrap table 列求和

    <div class="modal fade in" id="_modalDialog" tabindex="1" role=&quo ...

  5. Bootstrap Table列宽拖动的方法

    在之前做过的一个web项目中,前端表格是基于jQuery和Bootstrap Table实现的,要求能利用拖动改变列宽,现将实现的过程记录如下: 1. Bootstrap Table可拖动,需要用到它 ...

  6. easyui datagrid Column Group 列组、 复杂表头 嵌套表头 组合表头 （转载）

    核心: rowspan:2   //占两行 colspan:3    //占三列 所有的colspan下的二级列表头,统一放在一个数组里. 文章一: 转载来源:https://blog.csdn.ne ...

  7. 动态生成table 列

    table.render({ elem: '#test-table-comelist' ,url: layui.setter.base + 'list/comelist' ,cols: [[]] ,d ...

  8. iview 中table列 一列显示多个数据（后台返回数组显示在列内）

    一.首先出现的是比较复杂的一种情况(多个key) 1.首先页面显示效果如下 2.后台返回数据格式如下: 3.在iview中table的columns中的render函数: 4.具体代码 render: ...

  9. Vue+Element Table 列标红

    效果图 列方法 调用 样式

  10. layui table 列宽百分比显示

    var layer = layui.layer, form = layui.form, table = layui.table; var $ = layui.$; /*select gysmc,zyz ...

随机推荐

  1. AngularJS(Part 10)--页面导航

    页面导航     过去,一个URL代表一个页面.但是随着Ajax的兴起,情况发生的很大的变化.不同的内容可以使用同一个URL.这让浏览器中的回退.前进甚至收藏按钮都失去了作用.而AngularJS提供 ...

  2. Shell字符串截取处理文件路径

    在生信处理流程中,从最初的fastq文件,经过分析处理后,会生成一堆的后续文件,如何在流程中合理的命名呢? 通常在批处理模式中,我们会得到多个样本*.fastq(或*.fq.*.fastq.gz.*. ...

  3. neon eclipse tomcat发布项目乱码

    解决方法如图

  4. python写入文件编码报错

    decode的作用是将其他编码的字符串转换成unicode编码,如str1.decode('gb2312'),表示将gb2312编码的字符串str1转换成unicode编码. encode的作用是将u ...

  5. sql各种查询技巧

    SQL Server T-SQL高级查询 高级查询在数据库中用得是最频繁的,也是应用最广泛的. Ø 基本常用查询 --select select * from student; --all 查询所有 ...

  6. spring boot 使用 POI 读取Excel文件

    内容简介 本文主要介绍使用POI进行Excel文件的相关操作,涉及读取文件,获取sheet表格,对单元格内容进行读写操作,以及合并单元格的操作. Excel文件目录 Excel模板文件存了resour ...

  7. 原来C#可以直接写二进制数的

    二进制数在C#中的写法: byte b=0b01111110 二进制字符串的解释: string bstr="0111110"; byte b=Convert.ToByte(bst ...

  8. winform中的Datagridview控件与List同步修改

    Winform的datagridview是个很强大的控件,可用datatable, List等型的数据与之绑定显示. 可惜的是,绑定的LIst不能同步更新. 估计是为了改进List不能同步更新的问题, ...

  9. PAT天梯赛L3-004 肿瘤诊断

    题目链接:点击打开链接 在诊断肿瘤疾病时,计算肿瘤体积是很重要的一环.给定病灶扫描切片中标注出的疑似肿瘤区域,请你计算肿瘤的体积. 输入格式: 输入第一行给出4个正整数:M.N.L.T,其中M和N是每 ...

  10. thinkphp5控制器访问转换问题

    假设定义了HelloWorld控制器 url访问地址就是:http://localhost/index.php/index/hello_world,与此同时view目录下的模板文件夹要命名为hello ...