gpt4 book ai didi

html - 为什么我的 HTML 表格会延伸到底部和右侧?

转载 作者:行者123 更新时间:2023-11-28 02:01:03 25 4
gpt4 key购买 nike

It looks like this

这就是它的样子,您可以看到它向右和底部延伸。我正在尝试修复它但无法修复。我也在使用引导表类。这是我的代码:
HTML:

<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<table class="table table-bordered">
<tbody>
<tr>
<td class="1"></td>
<td class="2"></td>
<td class="3"></td>
</tr>
<tr>
<td class="4"></td>
<td class="5"></td>
<td class="6"></td>
</tr>
<tr>
<td class="7"></td>
<td class="8"></td>
<td class="9"></td>
</tr>
</tbody>
</table>
</body>

CSS:

table {
width:500px;
height:500px;
position: absolute;
left: 37.25%;
top: 20%;
table-layout: fixed;
}

td {
border:2px solid #428bca;
height:100px;
width: 100px;
}

tr {
background-color:white;
}

我该如何解决这个问题?感谢阅读!
编辑:这就是我希望我的表的样子:pic

最佳答案

根据我对您想要实现的目标的理解,尝试在您的 CSS 中进行以下更改

table
{
height:800px;
position: absolute;
table-layout: fixed;
}
td
{
border:2px solid #428bca;
height:100px;
width: 100px;
}
tr
{
background-color:white;
}

如果你想让你的表格占据屏幕的整个高度以适应这些框,你需要动态获取屏幕的高度(通过 Javascript)

您可以引用以下页面了解更多详情。 https://www.w3schools.com/jsref/prop_screen_height.asp

干杯

关于html - 为什么我的 HTML 表格会延伸到底部和右侧?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49331153/

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