固定定位可以使用于很多网站上，就比如正常滚动网页的时候，正常的网页上一般都会有一个上方，左侧等等位置会有一个导航栏等东西。但是随着页面滚动之后如果是页面元素会正常向上滚动，所以为了让这个元素正常固定，就需要使用到固定定位。

概念

相对定位	绝对定位	固定定位
相对于元素自己本身的位置。	相对于非static（静态）的父元素进行移动，若没有父元素或所有父元素均为static（静态），则默认相对于浏览器窗口进行移动。	相对于浏览器窗口，且不会因为任何父元素的position改变而变化。
原本的元素会继续保持在原本文档流的位置不动。	原内容会脱离正常的文档流，会对后面的元素产生一定的影响。	原内容会脱离正常的文档流，会对后面的元素产生一定的影响。

语法格式

属性

• position：默认值是static，固定定位则是fixed
• top：正值：相对于父元素的上边框增加多少距离（向下移动）；负值：相对于父元素的上边框减少多少距离（向上移动）；优先级高于bottom
• left：正值：相对于父元素的左边框增加多少距离（向右移动）；负值：相对于父元素的左边框减少多少距离（向左移动）；优先级高于right
• bottom：正值：相对于父元素的下边框增加多少距离（向上移动）；负值：相对于父元素的下边框减少多少距离（向下移动）
• right：正值：相对于父元素的右边框增加多少距离（向左移动）；负值：相对于父元素的右边框减少多少距离（向右移动）
• z-index：层级顺序，固定定位元素高于普通文档流中元素

格式

.elements {
    position: fixed;
    top: 10px;
    left: 20px;
}