我們使用內聯樣式屬性，在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中設置表格寬度？的詳細內容，更多請關注www.92cms.cn其它相關文章！
標簽：html 如何在 寬度 表格 設置
網友整理
注冊時間：
網站：5 個
小程序：0 個
文章：12 篇
-
51998
網站
- 12
小程序
-
1030137
文章
-
747
會員
趕快注冊賬號，推廣您的網站吧！
答題星2018-06-03
您可以通過答題星輕松地創建試卷
