想让table表的样式变得好看一点,去掉间隔并且规律添加背景色
其实一共需要2步操作
1.添加单元格间隔
border-collapse: collapse
border-collapse 默认值为separate,即每个td单元格都有独立的边框;collapse表示相邻单元格共用一个边框,此时 border-spacing 将不起作用,设置为collapse单元格间距将消失。
table {
border-collapse: collapse;
}
table tr td {
border: solid 2px #222;
}
2.隔行显示不同背景颜色
可使用nth-child伪类实现,参数分为odd(奇数行)和 even(偶数行),只需复写一个即可
table tr {
background: #fff;
}
table tr:nth-child(even) {
background: #ccc;
}
版权声明:本文为Honnyee原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。