我们使用内联样式属性，在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中文网其他相关文章！
