如何通过CSS控制Table表格边框的颜色和样式,设置边框成单线?

作者:IT技术 | 时间:2018-10-26

table表格的边框默认比较难看,如何通过CSS控制Table表格边框的颜色和样式,table边框设置成单线?下面我就为大家介绍下。

默认的table边框

如何通过CSS控制Table表格边框的颜色和样式,设置边框成单线?

如何通过CSS控制Table表格边框的颜色和样式,table边框设置成单线?

如何通过CSS控制Table表格边框的颜色和样式,设置边框成单线?

设置CSS样式:

td{border:solid #add9c0; border-width:0px 1px 1px 0px;}
.table{border:solid #add9c0; border-width:1px 0px 0px 1px;}

但是文字内容和表格边框亲密到没有空隙就影响到美观了,加入padding属性

.td{border:solid #add9c0; border-width:0px 1px 1px 0px; padding:10px 0px;}
.table{border:solid #add9c0; border-width:1px 0px 0px 1px;}

效果如下:

如何通过CSS控制Table表格边框的颜色和样式,设置边框成单线?