gpt4 book ai didi

html - 一个表头中的多个表头

转载 作者:行者123 更新时间:2023-11-28 15:16:09 25 4
gpt4 key购买 nike

我的 HTML 表格有一个特殊的标题,其中包含 3 个子标题和自己的表格行。我尝试使用 rowspancolspan 来完成它,但我在两者之间迷路了。我将尽我最大的努力来说明我试图使用 HTML 表格实现的目标。

/-------------------------------------------------------------\
| | Two | | |
| One |------------------------------| Three | Four |
| | Two A | Two B | Two C | | |
|-----------------------------------------|---------|---------|
| 1.0 | 20.00 | 40.00 | 52.00 | 45 | 62 |
|-----------------------------------------|---------|---------|
| 2.0 | 60.00 | 70.00 | 84.00 | 54 | 45 |
\-------------------------------------------------------------/

这可以仅使用 HTML 表格来完成吗,还是我需要使用任何其他方法?

最佳答案

这是另一个只有 rowspan 和 colspan 的解决方案

<!DOCTYPE html>
<html>

<head>
<style>
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
}

th,
td {
padding: 5px;
text-align: center;
}
</style>
</head>

<body>

<table style="width:100%">
<tr>
<th rowspan="2">One</th>
<th colspan="3">Two</th>
<th rowspan="2">Three</th>
<th rowspan="2">Four</th>
</tr>
<tr>
<th>Two A</th>
<th>Two B</th>
<th>Two C</th>
</tr>
<tr>
<td>1.0</td><td>10.00</td><td>40.00</td><td>52.00</td><td>40</td><td>62</td>
</tr>
<tr>
<td>2.0</td><td>60.00</td><td>70.00</td><td>84.0</td><td>54</td><td>45</td>
</tr>
</table>

</body>

</html>

关于html - 一个表头中的多个表头,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43378942/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com