固定定位 fixed 表示固定定位
* 相对于浏览器窗口进行定位
* 固定定位也是一种绝对定位 只是他的参照物是body
* 只要开启了定位 就会产生层级关系
应用于跟随网页上下滑动的固定广告位置
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>固定定位</title>
<style>
.c1{
width: 200px;
height: 200px;
background-color: #800080;
}
.c2{
width: 200px;
height: 200px;
background-color: #FF0000;
/*
* fixed 表示固定定位
* 相对于浏览器窗口进行定位
* 固定定位也是一种绝对定位 只是他的参照物是body
* 只要开启了定位 就会产生层级关系
*
*/
position: fixed;
left: 0px;
top: 300px;
}
.c3{
width: 200px;
height: 200px;
background-color: #880000;
}
</style>
</head>
<body style="height: 5000px;">
<div class="c1"></div>
<div class="c2"></div>
<div class="c3"></div>
</body>
</html>
