zoukankan      html  css  js  c++  java
  • 毕设问题(1)表格table的表头自定义、复合表头,组合表格

    毕业设计,是一个web项目,遇到的些问题,记录下来。也许也有同样只知道一些,不是那么系统的学过的人,会遇到同样的问题,希望有所帮助。

    百度知道有这样一个问题:

    bootstrap table 如何实现自定义表头?如图.

    通常我们只看到是普通的二维表,但是有时候会有如上图的组合表头情况,这里需要使用th的两个可选属性rowspan和colspan分别是用来修改单元格的竖着和横着占的大小,实现上面的效果需要设置两行tr的thead,1,2,4的<th rowsapn="2"></th>,3的<th colspan="3"></th>.即可.

    具体样例:

    <table class="table table-striped table-condensed table-hover table-bordered">
        	<thead>
        		<tr>
        		<th rowspan="2">专业ID</th>	
     			<th rowspan="2">主干课程</th>
     			<th colspan="4">通识教育</th>
    			<th colspan="4">专业基础</th>
     			<th colspan="4">专业课</th>
     			<th colspan="4">独立实践</th>
     			<th rowspan="2">操作</th>
        		</tr>
        		<tr>
        		<th>学分</th>
        		<th>学时</th>
        		<th>必修比例</th>
        		<th>选修比例</th>
        		<th>学分</th>
        		<th>学时</th>
        		<th>必修比例</th>
        		<th>选修比例</th>
        		<th>学分</th>
        		<th>学时</th>
        		<th>必修比例</th>
        		<th>选修比例</th>
        		<th>学分</th>
        		<th>学时</th>
        		<th>必修比例</th>
        		<th>选修比例</th>
        		</tr>
        	</thead>
    <tbody>
        		<tr>.....</<tr>
    </tbody>
    </table>
    

      效果图:

    欢迎转载,但请声明出处。
  • 相关阅读:
    1040 最大公约数之和(欧拉函数)
    1028 大数乘法 V2(FFT or py)
    1020 逆序排列(DP)
    1837 砝码称重
    1070 Bash游戏 V4
    1280 前缀后缀集合(map)
    1390 游戏得分(贪心)
    1179 最大的最大公约数
    1400 序列分解(dfs)
    1420 数袋鼠好有趣(贪心二分)
  • 原文地址:https://www.cnblogs.com/tianjiqx/p/5398511.html
Copyright © 2011-2022 走看看