`

CSS - table - 单元格之间的空隙

 
阅读更多
1、样式重置(防止margin或padding等引起的间距):
body,table,tr,td{margin:0px;padding:0px;}
img{border:0}
2、页面里table标签声明边框粗细为0、单元格边距为0、单元格间距为0:

     <table border="0" cellspacing="0" cellpadding="0">

      cellspacing=0 cellpadding=0是属性,不是CSS样式,不能写在CSS里边的。

      你要写在CSS的话,这样写
       table { border-collapse: collapse; padding: 0;}

 

3.    cellspacing是表格里单元格之间的距离;
       cellpadding是表格里单元格内的空白部分;
俗称就是外补丁和内补丁,类似应用在div和span上的margin和padding
你可一试验一下,给单元格加上边框,在改变一下cellpadding和cellspacing的值,看有什么变化.
例如:
<table>
<tr>
  <td style="cellspacing:10px;cellpadding:10px;border:1px solid #CCCCCC;">
   
  </td>

  <td style="cellspacing:10px;cellpadding:20px;border:1px solid #CCCCCC;">
   
  </td>
</tr>
</table>

着就是说:td的border与table的边缘之间有10个像素的补丁(cellspacing),td的border与td的内元素有20个像素的补丁(cellpadding).

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics