css中元素的position属性详解

css中元素的position属性

position属性有五个可以设置的值，分别是static，absolute，relative，fixed，inherit

static：默认值，无定位；元素仍然存在于标准文档流中

absolute：绝对定位，元素相对于它的第一个定位父级元素进行定位。元素的位置可以通过top，right，bottom，left属性进行设置；使用了绝对定位的元素会生成一个块级框，无论它是行内元素还是块级元素,故使用了绝对定位的元素可以随意的设置宽高了(不需要再将元素设置成块级元素或者行内块元素)；元素将不再占据它原本所占的位置，会脱离标准文档流；

relative：相对定位，相对与其原本所占的位置进行定位；元素的位置可以通过top，right，bottom，left属性进行设置；使用该定位之后的元素不会脱离文档标准流；

fixed：固定定位，相对于浏览器窗口进行定位；元素会脱离文档标准流；

inherit：继承，元素会继承其父元素所设置position的值；

以上：使用了absolute和fixed进行定位的元素都会生成一个块级框，无论它原来是块级元素还是行内元素，且都会脱离文档标准流，不再占据元素原来的位置；

标准文档流就是元素会自动在网页中按照从上到下，从左到右的流式进行排列；