HTML表格允許我們在網頁上將資料按行和列排列。
我們使用
| 、 |
|---|
| 元素來設定表頭、行和列以及表格資料。
表格行由 |
標籤。
範例以下是建立表格行和列的範例程式。 <!DOCTYPE html>
<html>
<style>
table {
border:1px solid black;
padding: 10px;
}
th, td{
border:1px solid black;
padding: 20px;
}
</style>
<body>
<h2>Tables in HTML</h2>
<table style="width: 100%">
<tr>
<th></th>
<th></th>
<th></th>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
登入後複製 範例以下是另一個建立表格行和列的範例程式。 <!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid green;
}
</style>
</head>
<body>
<h2>Adding table rows and colomns in HTML</h2>
<table>
<tr>
<th>S.no</th>
<th>Name</th>
<th>Age</th>
<th>Country</th>
</tr>
<tr>
<td>1</td>
<td>Kohli</td>
<td>34</td>
<td>India</td>
</tr>
<tr>
<td>2</td>
<td>Rabada</td>
<td>29</td>
<td>South Africa</td>
</tr>
<tr>
<td>3</td>
<td>Starc</td>
<td>33</td>
<td>Australia</td>
</tr>
</table>
</body>
</html>
登入後複製 範例下面是另一個用於建立表格行和列的範例程式。 <!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid green;
}
</style>
</head>
<body>
<h2>Adding table rows and colomns in HTML</h2>
<table style="width:80%">
<caption>Cricketers...</caption>
<tr style="background-color: Mediumseagreen">
<th>S.no</th>
<th>Name</th>
<th>Age</th>
<th>Country</th>
</tr>
<tr>
<td>1</td>
<td>Kohli</td>
<td>34</td>
<td>India</td>
</tr>
<tr>
<td>2</td>
<td>Rabada</td>
<td>29</td>
<td>South Africa</td>
</tr>
<tr style="background-color: Mediumseagreen">
<td>3</td>
<td>Starc</td>
<td>33</td>
<td>Australia</td>
</tr>
</table>
</body>
</html>
登入後複製 |
以上是如何在HTML中建立表格的行和列？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
