我想用 CSS 定位我的文档，我想知道将 body 元素的位置属性设置为 relative 以建立初始包含 block 的共识是什么。这被认为是不好的做法吗？我读过它是没有必要的，也就是说，如果 body 元素的第一个子元素是绝对定位的，它包含 block 默认为 HTML 元素，这相当于视口(viewport)。我很困惑，因为我似乎无法在没有 body {position: relative;} 的情况下进行定位。
这是 HTML 和 CSS:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="styles.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div id="div1">
<p id="p1">
content
</p>
</div>
<div id="div2">
<p id="p2">
content
</p>
</div>
</body>
</html>
body{
position: relative;
}
#div1 {
position: absolute;
top: 500px;
width:auto;
margin: auto;
}
#p1 {
position: absolute;
width: auto;
background-color: aqua;
}
#div2 {
position:absolute;
top: 200px;
background-color: red;
}
#p2 {
position: absolute;
}
我把这个例子放在一起，这样我就可以开始处理 position、margin 和 width 的不同值。这与我最初发布的有很大不同。我希望了解如何为文档中所有其他定位元素设置初始上下文，以便最终了解浏览器如何计算自动值。我开始对自动设置页面上的宽度和居中元素感到困惑。
最佳答案
答案是肯定的，也不是。
是的，不是因为它是 body标签，但因为它是您的 position:absolute 的父级在这种情况下标记。 position:absolute始终引用其父级，需要将其设置为 position:relative .
不，通常您不需要为 body 设置位置标签。如果你的#div有一个像 <div class = "container"> 这样的父容器, .container需要设置为 position:absolute .
关于html - body {位置: relative;}，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42776206/