html table 序号,html的table多级表头表格的代码

1，两级表头的代码

多层表头

td,

th {

font-style: normal;

font-weight: normal;

text-align: center;

}

tr {

height: 48px;

}

.twoHead th {

width: 6.25%;

height: 48px;

padding: 0 10px;

font-size: 14px;

font-weight: normal;

}

.firstHead th {

font-size: 14px;

font-weight: bold;

}

table {

border: none;

border-collapse: collapse;

border-color: #D8DFE6;

}

table thead {

background: #F3FDFF;

}

序号村庄名称本周采集房屋总量(户)累计采集房屋总量(人)本周隐患处理情况(处)合计对比上周变化出租房屋数量对比上周变化自住房屋数量对比上周变化总计出租房屋累计自主房屋累计新增隐患消除隐患现存隐患对比上周

∞30万20万60万100万看着办∞∞20万100万看着办∞∞20万20万20万20万

效果图片为：

2，两个以上级表头的代码

多层表头22

td,

th {

font-style: normal;

font-weight: normal;

text-align: center;

}

tr {

height: 48px;

}

.firstHead,

.twoHead,

.threeHead {

height: 32px;

}

.fourHead {

height: 64px;

}

.firstHead th {

font-size: 14px;

font-weight: bold;

}

table {

border: none;

border-collapse: collapse;

border-color: #D8DFE6;

}

table thead {

background: #F3FDFF;

}

table tbody td {

width: 6.3%;

}

table tbody tr {

height: 50px;

}

序号终端使用人工作开展情况工作量总计采集情况检查情况人口房屋车辆房屋隐患总数户籍流动总数自住出租总数机动车非机动车总数生活安全出租管理房屋功能

∞30万20万60万100万看着办∞∞20万100万看着办∞∞20万20万20万20万20万

图片显示效果：