固定定位应该算是三种定位中最简单的了.

他完全脱离文档流, 与文档中的其他元素没有一点关系.

他完全参照浏览器的的边缘来布局, 固定在某个区域不管页面如何滚动, 都与他无关.

设置: position : fixed; 这个元素就会固定定位了.

<style>
div{
    width: 500px;
    height: 50px;
    background-color: pink;
    position: fixed;
}
p{
    width: 800px;
    height: 500px;
    background-color: gray;
}
p:nth-child(2n){
    background-color:linen;
}
</style>
<div></div>
<p></p>
<p></p>
<p></p>

很多页面滚动的时候边上那些固定不动的都会用到固定定位.