1. 程式人生 > >table中cellspacing和cellpadding的區別

table中cellspacing和cellpadding的區別

在table中我們經常使用cellspacing和cellpadding來增加單元格之間的間距,二者起到的效果貌似差不多,但是他們實現的方式確實不一樣的,下面看一下它們之間的區別吧!

cellpadding: 表示單元格(<td>)內邊距到其內容之間的距離

看下圖: 綠色表示td的背景色,也就是表示td的大小, 1001表示td中的內容.圖中標註的10px就是cellpadding設定的距離.

<table cellpadding = "10px">

</table>

cellpadding
可以看出,在其內容不變的情況下,cellpadding越大,單元格td也就被撐的越大.這也就導致了看上去單元格之間的距離變大了,其實是單元格被撐大了而已.

cellspacing:表示單元格與單元格之間的距離:

設定cellspacing="30px"起到的作用:
cellspacing
由圖可以看出,td的大小其實就是背景色那麼大,但是兩個單元格的距離卻變大了,這主要是設定cellspacing起到的效果.