使用css控制table的cellspacing和cellpadding属性

HTML默认的表格样式之间有间隙,每次为了解决这些问题,总要在table标签里添加cellspacing和cellpadding,你是否也很厌倦这样的写法,

那么有没有对应的CSS属性能达到相同的效果呢?

1 <table cellspacing=0 cellpadding=0>
2 </table>

答案是肯定的,cellspacing属性对应table的border-spacing CSS属性,但是cellpadding属性对应td的padding属性

1 table{
2     border-spacing:0;  
3 }
4 td{
5     padding:0;  
6 }

table还有很多CSS属性可以控制,比如table-layout,border-collaspse

如果你使用多个表格布局,发现由于边框使得宽度对齐出现问题,可以使用box-sizing属性,把它设置为border-box就可以了,计算盒模型的时候就会加上边框,这个属性IE8+都支持,火狐下需要使用带前缀的方式-moz-box-sizing。

快来试试吧。

原文地址:https://www.cnblogs.com/jamesldj/p/3256525.html