CSS 固定定位 position fixed
简单描述：固定定位是将某个元素固定在浏览器的某个确定的位置，不随滚动条的移动而变化；
注意：固定定位的位置是 相对当前浏览器窗口的
代码示例：
1.我们先在页面中输出一个标准情况下的 div 元素，不添加定位；
代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
*{margin:0;padding:0;}
.abc{width:200px; height:200px; background-color:red; border:2px solid yellow;}
</style>
</head>
<body>
<div class="abc"></div>
</body>
</html>
显示如下：
2. 然后给 div 元素添加固定定位：设置 position:fixed; left:100px; top:100px;
代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
*{margin:0;padding:0;}
.abc{width:200px; height:200px; background-color:red; border:2px solid yellow;
position:fixed; left:100px; top:100px;}
</style>
</head>
<body>
<div class="abc"></div>
</body>
</html>
显示：
3.我们再次修改定位： position:fixed; right:100px; top:100px;
显示效果：
可以看出坐标系是不断变化的，
那么： left + top： 相对于 左 上 顶点进行位移
left+bottom：相对于 左 下 顶点进行位移
right +top：相对于 右 上 顶点进行位移
right +bottom：相对于 右 下 顶点进行位移
