定位
/* position: relative;/*相对定位,相对自己原来的位置移动,以左上角为基准*/
position:absolute;/*绝对定位,不保留自己原来的位置,按照父级标签或者祖先级
标签,设置了position为relative的标签的位置进行移动,如果一直找不到设置了
这个标签的属性,那么按照body标签来移动
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.c1{
width: 100px;
height: 100px;
border: 2px solid red;
}
.c2{
width: 100px;
height: 100px;
border: 2px solid blue;
/* position: relative;/*相对定位,相对自己原来的位置移动,以左上角为基准*/
/* top: ; */
/* left: 100px; 需要右移,相当于左边距离100px */
/* right: ; */
/* bottom: ; */
position:absolute;/*绝对定位,不保留自己原来的位置,下面的绿色顶上去了
}
.c3{
width: 100px;
height: 100px;
border: 2px solid green;
}
</style>
</head>
<body>
<div class="cc">
<div class="c1"></div>
<div class="c2"></div>
<div class="c3"></div>
</div>
</body>
</html>