前端基礎---表格認識(一)
阿新 • • 發佈：2021-07-02
表格在日常生活中使用的非常的多，比如excel就是專門用來建立表格的工具，
表格就是用來表示一些格式化的資料的，比如：課程表、銀行對賬單
在網頁中也可以來創建出不同的表格。
在HTML中，使用table標籤來建立一個表格
在table標籤中使用tr來表示表格中的一行，有幾行就有幾個tr
在tr中需要使用td來建立一個單元格，有幾個單元格就有幾個td
rowspan用來設定縱向的合併單元格
colspan橫向的合併單元格
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <!-- 表格在日常生活中使用的非常的多，比如excel就是專門用來建立表格的工具， 表格就是用來表示一些格式化的資料的，比如：課程表、銀行對賬單 在網頁中也可以來創建出不同的表格。--> <!-- 在HTML中，使用table標籤來建立一個表格 --> <table border="1" width="40%" align="center"> <!-- 在table標籤中使用tr來表示表格中的一行，有幾行就有幾個tr --> <tr> <!-- 在tr中需要使用td來建立一個單元格，有幾個單元格就有幾個td--> <td>A1</td> <td>A2</td> <td>A3</td> <td>A4</td> </tr> <tr> <td>B1</td> <td>B2</td> <td>B3</td> <!-- rowspan用來設定縱向的合併單元格 --> <td rowspan="2">B4</td> </tr> <tr> <td>C1</td> <td>C2</td> <td>C3</td> </tr> <tr> <td>D1</td> <td>D2</td> <!-- colspan橫向的合併單元格 --> <td colspan="2">D3</td> </tr> </table> </body> </html>