如何在 HTML 中合併表格單元格?
我們使用 colspan 和 rowspan 屬性合併 HTML 中的單元格。 rowspan 屬性用於指定一個單元格應該合併的行數,而 colspan 屬性用於指定一個單元格應該合併的列數。
該屬性應該放在 <td> 標籤內。
語法
以下是合併 HTML 中表格單元格的語法。
<td rowspan="2">cell data</td>
示例
以下是合併 HTML 中表格行單元格的示例程式。
<!DOCTYPE html> <html> <style> table,tr,th,td { border:1px solid black; } </style> <body> <h2>Tables in HTML</h2> <table style="width: 100%"> <tr> <th >First Name </th> <th>Job role</th> </tr> <tr> <td >Tharun</td> <td rowspan="2">Content writer</td> </tr> <tr> <td >Akshaj</td> </tr> </table> </body> </html>
使用 colspan 屬性
我們可以使用以下語法合併表格的列單元格。
語法
對於 colspan,我們使用以下語法。
<td colspan="2">cell data</td>
示例
以下是合併 HTML 中表格列單元格的示例程式。
<!DOCTYPE html> <html> <style> table,tr,th,td { border:1px solid black; } </style> <body> <h2>Tables in HTML</h2> <table style="width: 100%"> <tr> <th >First Name </th> <th>Last Name</th> <th>Job role</th> </tr> <tr> <td colspan="2" >Tharun chandra</td> <td >Content writer</td> </tr> <tr> <td colspan="2">Akshaj Vank</td> <td >Content writer</td> </tr> </table> </body> </html>
示例
以下是我們在 HTML 表格 上執行 rowspan 和 colspan 的示例程式。
<!DOCTYPE html> <html> <style> table,tr,th,td { border:1px solid black; } </style> <body> <h2>Tables in HTML</h2> <table style="width: 100%"> <tr> <th >First Name </th> <th>Job role</th> </tr> <tr> <td >Tharun</td> <td rowspan="2">Content writer</td> </tr> <tr> <td >Akshaj</td> </tr> <tr> <td colspan="2">Welcome to the company</td> </tr> </table> </body> </html>
廣告
資料結構
網路
RDBMS
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP