css布局之position

static:默认值。

  • 没有定位,元素出现在正常的流中(忽略top,bottom,left,right或者z-index声明)。

relative:

  • 生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常位置进行定位。可通过z-index进行层次分级。
  • relative定位的层总是相对于其最近的父元素,无论其父元素是何种定位方式。
  • 定位为relative的元素脱离正常的文本流中,但其在文本流中的位置依然存在。

absolute:

  • 生成绝对定位的元素,相对于static定位以外的第一个父元素进行定位。元素的位置通过”left”,”top”,”right”以及”bottom”属性进行规定。可通过z-index进行层次分级。
  • 定位为absolute的层脱离正常文本流,但与relative的区别是其在正常流中的位置不再存在。
  • absolute定位的层总是相对于其最近的定义为absolute或relative的父层,而这个父层并不一定是其直接父层。

fixed:

生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过”left”,”top”,”right”以及”bottom”属性进行规定。可通过z-index进行层次分级。

z-index:

如果子级z-index为0,那么父级就是200000也不会覆盖住子级。原因如下:
在标准浏览器中,对父级的要求不是特别高,同级的对应上z-index可以了。但要注意的是父级里放一个子级那么父级是无法放在子级之上的,需要放在同一级别中才可以.

猜你喜欢

转载自blog.csdn.net/summerpowerz/article/details/80545828
今日推荐