gpt4 book ai didi

html - 页面中间的框?

转载 作者:太空宇宙 更新时间:2023-11-03 20:52:05 26 4
gpt4 key购买 nike

我想用css在窗口中间放一个盒子,但是不行。例如,html 元素的高度似乎不是 100%。

<!DOCTYPE HTML>

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Box</title>

<style type="text/css">
html {
width: 100%;
height: 100%;
display: table-cell;
vertical-align: middle;
}
body {
margin: auto;
width: 300px;
height: 300px;
border: 1px solid black;
}
</style>

</head>

<body>
box
</body>
</html>

最佳答案

乱用 html 和 body 使其显示:table-cell 或其他东西不是一个好主意

相反,试试这个代码:

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Box</title>

<style type="text/css">
html {
width: 100%;
height: 100%;
}
div {
width: 300px;
height: 300px;
position: absolute;
left: 50%;
top: 50%;
margin: -150px 0 0 -150px;
border: 1px solid black;
}
</style>

</head>

<body>
<div>box</div>
</body>
</html>

关于html - 页面中间的框?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14775367/

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