关于相对定位和绝对定位的问题
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
/*完善下列代码*/
.per{
width: 300px;
height: 300px;
background: red;
margin-left:200px;
margin-top: 200px;
position:absolute;
}
.son{
width: 100px;
height: 100px;
background: blue;
position:absolute;
left:100px;
bottom:100px;
}
</style>
</head>
<body>
<div class="per">
<div class="son"></div>
</div>
</body>
</html>
老师请问我把父类元素和子类元素都设置成的绝对定位也能够达到效果啊。你们说的相对定位相对于自己定位是什么意思啊。相对不应该有对比参照物吗
正在回答 回答被采纳积分+1
同学你好,1、同学的代码这样写也是可以的,但是这个练习的目的是要同学加深对相对定位和绝对定位的理解呢~
2、相对定位:会占用该元素在文档中初始的页面空间,通过left、right、top、bottom属性确定元素在正常文档流中的偏移位置,然后相对于以前的位置移动,移动的方向和幅度由left、right、top、bottom属性确定,偏移前的位置保留不动。
所以我们会说相对定位会相对于自己以前的位置定位。
3、绝对定位:作用将元素从文档流中拖出来,将不占用原来元素的空间,然后使用left、right、top、bottom属性相对于其最接近的一个具有定位属性的父级元素进行绝对定位。如果不存在就逐级向上排查,直到相对于body元素,即相对于浏览器窗口。
同学可以先看一下后面的相对与绝对定位对比课程,然后再回过头来再做这个练习就会有不一样的体会呐。
如果我的回答解决了你的疑惑,请采纳。祝:学习愉快~
- 参与学习 人
- 提交作业 676 份
- 解答问题 9666 个
本阶段将从前端网页搭建入手,到Java Web基础,前后端结合助你完成Java Web小白的蜕变!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星