<table> <tr> <th class="left-column">楼层号</th> <td></td> </tr> <tr> <th class="left-column">房间号</th> <td></td> </tr> <tr> <th class="left-column">楼层</th> <td></td> </tr> <tr> <th class="left-column">可住人数</th> <td></td> </tr> <tr> <th class="left-column">已住人数</th> <td></td> </tr> </table>将表格放置在一个box中并设置合适的长宽要求左右两列的长度一致
时间: 2023-06-13 09:09:20 浏览: 240
可以使用以下HTML代码实现:
```html
<div style="width: 400px; height: 200px; border: 1px solid black; padding: 10px;">
<table style="width: 100%;">
<tr>
<th class="left-column" style="width: 50%;">楼层号</th>
<td style="width: 50%;"></td>
</tr>
<tr>
<th class="left-column" style="width: 50%;">房间号</th>
<td style="width: 50%;"></td>
</tr>
<tr>
<th class="left-column" style="width: 50%;">楼层</th>
<td style="width: 50%;"></td>
</tr>
<tr>
<th class="left-column" style="width: 50%;">可住人数</th>
<td style="width: 50%;"></td>
</tr>
<tr>
<th class="left-column" style="width: 50%;">已住人数</th>
<td style="width: 50%;"></td>
</tr>
</table>
</div>
```
在这个代码中,我们使用了一个 `<div>` 容器来包含整个表格,并设置了容器的长宽为400px和200px,以及边框和内边距。我们在容器内部放置了一个 `<table>` 元素,并设置了它的宽度为100%。然后,在表格中的每一行中,我们使用了 `<th>` 和 `<td>` 元素来表示左列和右列,分别设置了它们的宽度为50%。最后,我们使用了带有 `left-column` 类的 `<th>` 元素来设置左列的样式。
这样,我们就可以得到一个左右两列长度一致的表格,并放置在一个容器中。
阅读全文