table给table表格设置一个通用的css3样式(默认有斑马条纹)

Posted PHP急先锋

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了table给table表格设置一个通用的css3样式(默认有斑马条纹)相关的知识,希望对你有一定的参考价值。

/* = 表格(默认有斑马条纹)
------------------------------------------ */
.data-table {
    margin: 10px 0;
}
.data-table table {
    width: 100%;
    border-collapse: collapse; //设置表格边框合并为单一边框
}
.data-table caption {
    height: 30px;
    line-height: 30px;
    font-weight: 700;
}
.data-table thead th,
.data-table tbody td {
    padding:8px;
    height: 19px;
    line-height: 19px;
    font-weight: 400;
}
.data-table thead th {
    text-align: left;
    color:#fff;
    background-color: #353535;
}
.data-table tbody tr {
    background-color: #fefefe;
    color: #686868;
}
.data-table tbody tr:nth-child(even) {
    background-color: #f2f2f2;
}

/* 复选框的列宽 */
.row-selected {
    width: 15px;
}

2、

 

以上是关于table给table表格设置一个通用的css3样式(默认有斑马条纹)的主要内容,如果未能解决你的问题,请参考以下文章

如何设定html table 过宽下方出现滚动条

给表格中的文字设置字体以及设置表格样式

table 中 display为 block 时 tbody 失去宽度

如何给table表格的tr行加边框

html 怎么设置table内的字体 颜色 大小 对齐方式!!!!!!!!!!!!!!!!!!!

HTML中正确设置表格table边框border的三种办法