HTML cellspacing 屬性

admin發表於2020-03-11

此屬性用於設定 table 中單元格周邊的空間,以畫素為單位。

下面通過圖文方式對此屬性進行詳細分析,首先從其名稱入手。

cellspacing由如下兩個單詞合成:

(1).cell:翻譯漢語具有小房間和細胞的意思。

(2).spacing:翻譯成漢語具有空間的意思。

單元格在表格中的表現確實類似於小房間或者細胞,那麼就很容易理解此屬性的功能。

比較容易與 cellpadding 屬性混淆,具體用法參閱HTML cellpadding 屬性一章節。

特別說明:HTML5不支援此屬性,推薦使用CSS border-spacing 屬性設定。

語法結構:

[HTML] 純文字檢視 複製程式碼
<table cellspacing="num">

下面通過程式碼例項結合圖文對其功能進行分析:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<body>
<table border="1" cellspacing="5">
  <tr>
    <th>教程</th>
    <th>教程簡介</th>
  </tr>
  <tr>
    <td>HTML教程</td>
    <td>分享HTML知識</td>
  </tr>
  <tr>
    <td>CSS教程</td>
    <td>分享CSS知識</td>
  </tr>
  <tr>
    <td>JS教程</td>
    <td>分享JavaScript知識</td>
  </tr>
</table>
</body>
</html>

將cellspacing屬性值設定為"5",也就是當將單元格的周邊空間設定為5px。

程式碼執行圖示說明如下:

a:3:{s:3:\"pic\";s:43:\"portal/202003/11/190126dhsotdadsnnhc8sl.jpg\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

說明如下:

(1).cellspacing屬性用於設定單元格周邊的空間。

(2).此空間包括單元格與表格邊框之間的空間和單元格之間的空間。

(3).單元格相鄰的空間值不會累加。

(4).對於<th>同樣有效。