position是CSS中非常重要的一个属性，通过position属性，我们可以让元素相对于其正常位置，父元素或者浏览器窗口进行偏移 。
postion属性我们成为定位，它有4个不同类型的定位，这些类型会影响元素的生成方式，下面我们详细说明position属性。
Position 有 4 个属性值： 1.static 、 2.relative 、 3.absolute 、 4.fixed 。这几种属性。
Static ：是默认定位。不改变任何位置，网页也就按照正常的文档流规则排列。
Relative ：是相对定位。元素则按照正常的文档流来规则排序。但可以通过 left 、 top 、 bottom 、 right 等 css 规则来改变元素的位置。让网页看起来更加美观。
Absolute ：是绝对定位：元素会脱离文档流，元素可以通过： top 、 left 、 right 、 bottom 等 css 规则来改变元素的位置。让网页看起来美观。
Fixed ：是固定定位：元素会脱离正常的文档流，元素将被设置在浏览器上一个固定的位置上，不会随着元素滚动。元素可以通过： top 、 left 、 right 、 bottom 等 css 规则改变元素的位置。
Absolute ：是生成绝对定位，相对于最近一级的定位不是 static 的父元素来进行定位的， 元素设置成 absolute后会脱离文档流，并且不占有原本的空间，后面的元素会顶替上去 。
relative翻译成中文称相对定位，设置了这个属性后，元素会根据top，left，bottom，right进行偏移，关键点是它原本的空间仍然保留 。
Fixed （老 IE 不支持）生成绝对（固定）定位的元素，通常相对于浏览器窗口来进行定位。
而 relative 呢是生成相对定位的元素，相对于在普通的位置进行定位。
Static 该属性值是所有元素定位的默认情况，在一般情况下，我们不需要特别的去声明它，但有时候遇到继承的情况，我们不愿意见到元素所继承的属性影响本身，从而可以用 position:static取消继承，即还原元素定位的默认值。
Inherit：继承属性， 规定应该从父元素继承 position 属性的值。
！注意：很多网页都是居中的，这样，当对元素进行绝对定位的时候，在不同的分辨率下显示会有偏差，这时，我们可以通过类似下面的方法来处理：