HTML5表格的列宽怎么设置
在HTML5中，我们可以使用<table>、<tr>、<th>和<td>标签来创建一个表格，要设置表格的列宽，我们需要使用<colgroup>和<col>标签，下面是一个简单的示例：
<!DOCTYPE html>
<html>
<head>
<style>
table {
width: 100%;
border-collapse: collapse;
}
th, td {
border: 1px solid black;
padding: 8px;
text-align: left;
}
</style>
</head>
<body>
<h2>HTML5表格列宽设置</h2>
<table>
<colgroup>
<col style="width: 50%;">
<col style="width: 30%;">
</colgroup>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>25</td>
</tr>
<tr>
<td>李四</td>
<td>30</td>
</tr>
</table>
</body>
</html>
在这个示例中，我们首先使用<colgroup>标签定义了一组列，然后在其中添加了两列，分别设置了宽度为50%和30%，接下来，我们在表格中添加了两行数据，并使用<th>标签定义了表头单元格，这样，我们就可以看到表格的列宽已经被设置好了。
相关问题与解答
1、如何设置表格的行高？
答：要设置表格的行高，我们可以使用<tr>标签的height属性。
<tr style="height: 30px;">
这将使该行的高度为30像素，注意，高度值可以是像素(px)、百分比(%)或其他合法的CSS长度单位。
原创文章，作者：K-seo，如若转载，请注明出处：https://www.kdun.cn/ask/272546.html
微信扫一扫 