我在母版页上使用“相对位置”和“绝对位置”。
我有一个使用上面母版页的页面，我试图在这个页面中再次为其他 2 个元素使用“相对位置”和“绝对位置”，但下面的元素(“绝对位置”)在这个页面不是根据他上面的元素('position relative')放置的，而是指母版页中元素的'position relative'..
希望是不是太笨拙的解释..
是否可以在同一个 HTML 页面上多次使用“相对位置”？？？如果是，怎么办？？
html代码
<html>
<head>
<title></title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="basic.css">
</head>
<body>
<div class="one"></div>
<div class="two"></div>
<div class="three"></div>
<div class="four"></div>
</body>
</html>
CSS代码 body { 边距:0px； 填充:0px；
.one{
width: 200px;
height: 200px;
background: red;
position: relative;
}
.two{
width: 200px;
height: 200px;
background: green;
position: absolute;
top: 0px;
left: 200px;
}
.three{
width: 200px;
height: 200px;
background: blue;
position: relative;
}
.four{
width: 200px;
height: 200px;
background: black;
position: absolute;
top: 0px;
left: 200px;
}
最佳答案
当使用 position: absolute 时，它是根据祖先计算的，而不是兄弟，所以你的 .two 和 .four div 是相对于主体定位，而不是 .one 和 .two，请改用它:
<div class="one">
<div class="two"></div>
</div>
<div class="three">
<div class="four"></div>
</div>
关于html - 是否可以在同一个 html 页面中多次使用相对位置？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/25463799/