HTML 中的 <table>
標籤用於創建表格,這是一個非常有用的元素,可用於組織和顯示數據。以下是一些使用 <table>
標籤的基本範例:
html<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Simple Table Example</title>
</head>
<body>
<table border="1">
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
<tr>
<td>Row 2, Cell 1</td>
<td>Row 2, Cell 2</td>
</tr>
</table>
</body>
</html>
在這個例子中,我們使用 <table>
標籤來創建一個包含兩行和兩列的表格,並使用 <tr>
標籤表示每一行,<td>
標籤表示每一個單元格。
html<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Table with Caption and Header</title>
</head>
<body>
<table border="1">
<caption>My Table</caption>
<thead>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
<tr>
<td>Row 2, Cell 1</td>
<td>Row 2, Cell 2</td>
</tr>
</tbody>
</table>
</body>
</html>
在這個例子中,我們使用 <caption>
標籤添加表格標題,而 <thead>
標籤則用來定義表頭。表頭中的單元格通常使用 <th>
標籤,而正文部分的單元格則使用 <td>
標籤。
這僅僅是使用 <table>
標籤的基本範例,表格有更多的特性和屬性可以使用,例如合併單元格、設置邊框樣式、添加標題等。根據實際需要,你可以根據需要進行擴展和修改。