一.知识点
定位:基于XXX定位,上下左右~
- 没有父级元素的情况下,相对于浏览器定位
- 假设父级元素存在定位,我们通常会相对于父级元素进行偏移
- 在父级元素范围内移动
相对于父级或者浏览器的位置,进行指定的偏移,绝对位置的话,它不在标准文档流之中,原来的位置不会被保留
二.代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
body{
height: 600px;
}
div:nth-of-type(1){
width: 90px;
height: 90px;
background: #37d6aa;
position: absolute;/*绝对定位*/
right: 0;
bottom: 150px;
}
div:nth-of-type(2){
width: 50px;
height: 50px;
background: blanchedalmond;
position: fixed;/*固定定位*/
right: 0;
bottom: 50px;
}
</style>
</head>
<body>
<div>div1</div>
<div>div2</div>
</body>
</html>
三.运行结果