我正在使用jsrender,我需要使用页面中的所有空间,但在“页脚”中有一些空间无法使用,我需要表格使用完整的高度

html,
body {
height: 100%;
margin: 0;
font-size: 20px;
background-color: yellow;
}<body>
<table style=" height: 100%;margin: 0;background-color: red;">
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
<tr>
<td>Ernst Handel</td>
<td>Roland Mendel</td>
<td>Austria</td>
</tr>
<tr>
<td>Island Trading</td>
<td>Helen Bennett</td>
<td>UK</td>
</tr>
<tr>
</table>
</body>
发布于 2021-10-15 13:12:25
正如您在注释中所说的,您希望表格采用100%的可用宽度,只需将width:100%;添加到表格中即可。此外,您还应该将表格样式从inline-style移动到css。
我在下面的代码片段中添加了必要的样式:
html,
body {
height: 100%;
margin: 0;
font-size: 20px;
background-color: yellow;
}
table {
width: 100%;
height: 100%;
margin: 0;
background-color: red;
}<body>
<table>
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
<tr>
<td>Ernst Handel</td>
<td>Roland Mendel</td>
<td>Austria</td>
</tr>
<tr>
<td>Island Trading</td>
<td>Helen Bennett</td>
<td>UK</td>
</tr>
<tr>
</table>
</body>
https://stackoverflow.com/questions/69585102
复制相似问题