HTML rowspan 屬性

admin發表於2018-11-03
HTML

為了便於理解記憶，首先看一下單詞的構成：

row翻譯成漢語是行的意思，span具有跨度的意思。

此屬性屬於td單元格，設定單元格縱跨的行數。

程式碼例項如下：

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
</head>
<body>
<table border="1">
  <tr>
    <th>書籍</th>
    <th>價格</th>
    <th>總額</th>
  </tr>
  <tr>
    <td>螞蟻部落一</td>
    <td>800</td>
    <td rowspan="2">1600</td>
  </tr>
  <tr>
    <td>螞蟻部落二</td>
    <td>800</td>
  </tr>
</table>
</body>
</html>

程式碼執行效果截圖如下：

a:3:{s:3:\"pic\";s:43:\"portal/201811/03/092345drn67wdsdn63ts16.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

程式碼分析如下：

（1）.第二個行最後一個td單元格設定rowspan屬性值為2。

（2）.那麼上述單元格可以縱跨兩列，也就是一個單元格佔據了兩個單元格的高度。

（3）.第三行原本具有三個單元格，現在只寫兩個即可。

相關文章