麻烦老师解答，谢谢
来源：3-3 绝对定位（1）
dww1
2021-07-06 00:19:42
<style>
* {
margin: 0;
padding: 0;
}
.box1 {
height: 402px;
width: 402px;
border: 1px solid #000;
padding: 100px;
margin: 0 auto;
}
.box2 {
width: 200px;
height: 200px;
border: 1px solid #000;
padding: 100px;
position: relative;
top:200px;
right: 200px;
}
.box3 {
width: 98px;
height: 98px;
border: 1px solid #000;
padding: 50px;
position: absolute;
}
p{
width: 50px;
height: 50px;
background-color: orange;
position: absolute;
top: 0;
right: 0;
}
</style>
</head>
<body>
<div class="box1">
<div class="box2">
<div class="box3">
<p></p>
</div>
</div>
</div>
</body>
子元素离得最近的是.box3,所以会以.box3作为绝对定位，给.box2设置相对定位，相对页面进行移动，但是.box3为什么也会跟着移动，是因为.box3是.box2的子元素吗
2
<style>
*{
margin: 0;
padding: 0;
}
p{
width: 100px;
height: 100px;
background-color: red;
position: absolute;
right: 100px;
}
</style>
</head>
<body>
<p>1</p>
<div>2</div>
</body>
绝对定位，这里只设置四种搭配的用法，只写其中一种，例如 bottom 或top 为什么会主动向右靠，设置left或right 为什么又向上靠 不向下靠呢？
1回答
-
好帮手慕星星
2021-07-06
同学你好，问题解答如下：
1、是的 ，一方面box3是box2的子元素，另一方面box3是相对于box2进行定位的，box3绝对定位，box2相对定位。所以box2移动的时候，box3位置也会改变。
2、元素排列默认是从左到右，从上到下的。所以只设置top值或者bottom的时候，元素默认在左侧（不是向右靠）
只设置left或者right值时，元素默认在顶部。
祝学习愉快！
0
相似问题