div布局主要用到的css属性
table 此元素会作为块级表格来显示(类似
table-row-group 此元素会作为一个或多个行的分组来显示(类似
)。table-header-group 此元素会作为一个或多个行的分组来显示(类似 )。
table-footer-group 此元素会作为一个或多个行的分组来显示(类似
)。table-row 此元素会作为一个表格行显示(类似
)。table-column-group 此元素会作为一个或多个列的分组来显示(类似
)。table-column 此元素会作为一个单元格列显示(类似
)table-cell 此元素会作为一个表格单元格显示(类似
和 )table-caption 此元素会作为一个表格标题显示(类似
)页面测试.table,.table*{
margin: 0 auto;
padding: 0;
font-size: 14px;
font-family: Arial, 宋体, Helvetica, sans-serif;
}
.table{
display: table;
width: 80%;
border-collapse: collapse;
}
.tab_tr {
display: table-row;
height: 30px;
}
.tab_th{
display: table-cell;
font-weight: bold;/*给标题字体加粗*/
height: 100%;
border: 1px solid gray; /*设置单元格边框*/
text-align: center;
vertical-align: middle;
}
.tab-td{
display: table-cell;
height: 100%;
border: 1px solid gray;
text-align: center;
vertical-align: middle;
参考:https://www.cnblogs.com/joshinrai/p/6668392.html