三:
Position还有第三个值:fixed
Fixed和absolute差不多,有一点小的不同。
你会发现一些广告的页面,无论你怎样滚动滑轮,广告是不东的。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style type="text/css">
*{
margin: 0;
padding: 0;
}
div{
height: 200px;
width: 50px;
background-color: red;
color: #fff;
}
</style>
<title></title>
</head>
<body>
<div>前端前端前端前端前端前端前端前端前端</div>
<br>*500
</body>
</html>
现在又一个要求就是让红色的方块不东,无论我怎么滚动鼠标。
div{
height: 200px;
width: 50px;
background-color: red;
color: #fff;
position: fixed;
left: 0;
top: 100px;
}
这样就可以了!!
还有一个就是无论你的屏幕多大,他的广告都是居中不东的。
div{
height: 100px;
width: 100px;
background-color: red;
color: #fff;
position: fixed;
left: 50%;
top: 50%;
}
现在是小方块的左顶点在文档的50%,50%,怎么挪半个身位呢?
div{
height: 100px;
width: 100px;
background-color: red;
color: #fff;
position: fixed;
left: 50%;
top: 50%;
margin-left: -50px;
margin-top: -50px;
}
这样就可以了!