我們使用內嵌樣式屬性，在HTML中設定表格的寬度。此屬性在HTML的
標籤內使用，使用CSS屬性width來設定表格的寬度。
文法
以下是在HTML中設定表格寬度的語法。
<table style="width: width value in percentage">… </table>
登入後複製
Example
的中文翻譯為：範例
以下是在 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: 50%">
<tr>
<th>Name </th>
<th>Job role</th>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
登入後複製
在上面的範例中，我們使用了width=50%，它會將我們的表格擴展到網頁上瀏覽器標籤大小的50%。
Example
的中文翻譯為：範例
下面是另一個在 HTML 中設定表格寬度的範例程式。
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid green;
}
</style>
</head>
<body>
<table style="width:100%">
<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>babar azam</td>
<td>34</td>
<td>pakistan</td>
</tr>
<tr>
<td>2</td>
<td>Shami</td>
<td>29</td>
<td>India</td>
</tr>
<tr style="background-color: Mediumseagreen">
<td>3</td>
<td>Cummins</td>
<td>33</td>
<td>Australia</td>
</tr>
</table>
</body>
</html>
登入後複製
現在我們嘗試使用 style 屬性將表格擴展到瀏覽器標籤大小。
Example
的中文翻譯為：範例
以下是使用 style 屬性將表格擴展到瀏覽器標籤大小的範例程式。
<!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>Name </th>
<th>Job role</th>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
</body>
</html>
登入後複製
以上是如何在HTML中設定表格寬度？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
