前端开发时position属性的作用

position是给前端元素增加定位方式的一个属性，我们要知道html本质上是一个需要浏览器等特定方式解析的语言，我们最终看的页面效果也是重头到位为解析之后的一个结果，本来所有的元素都是一个一个的按照他们的块类列，或行或列，被挨着解析出来，但在被解析中我们有时常常会有让某一个元素脱离原来展示顺序和位置的需求，这个时候就用到了position，下面是它每一个值的用途

static：默认值，不做任何特殊定位操作，一切按照它本来的样子

relative：相对定位，这个值单独使用的时候没有任何用处，因为它的官方解释是按照默认值的位置进行偏移，并且不会脱离文档流，也就是说想依靠它让元素有特殊的位置，还不如直接改变外边距来得实在。

absolute：绝对定位，它生效的前提是它的父级元素拥有非static的定位，定位时会脱离文档流，位置参照父级元素而决定，如果没有父元素，那则会以body为参照，所以使用它通常都是absolute和relative一起使用，不过html5之后多出了画布，很多时候会使用position:absolute;z-index:-2使得画布脱离文档流变成一个背景。

fixed：固定定位，使用该定位方式的元素，它的位置始终以body为对比对象，并脱离文档流。

inherit ：继承定位，使用这个值的元素，会继承父级元素的定位方式

以上的定位都可以通过top,bottom,left,right四个CSS参数来设置位置。