定位小结、定位叠层、网页元素透明度、transform过渡属性tratsiion

1.定位总结

绝对定位的特性：绝对定位是相对于它的定位父级的位置来定位，如果没有设置定位父级（给父级定位position:relative），则相对浏览器窗口来定位，使用绝对定位元素后位置发生偏移时，原来的位置不会被保留，层级提高（就是下面要提的定位叠层有关了），可以把标准文档流中的元素及浮动元素盖在下边，设置绝对定位的元素脱离文档流，简单的说，谁的等级高（默认等级z-index=0）谁就覆盖在上面，绝对定位的使用场景，一般情况下，绝对定位用在下拉菜单、焦点图轮播、弹出数字气泡、特别花边等场景。

2.定位叠层

定位叠层就是给定位的元素设置等级，使其叠层覆盖，等级越高，元素就叠在最上面。

使用z-index属性值：整数，默认值为0

设置了position定位(absolute、relative、fixed)元素属性时，z-index属性根据设置各元素之间的重叠高低关系叠层。就好比说，两个绝对定位没设置z-index在一起时，给其中一个绝对定位设置z-index=1，这个就会覆盖另一个绝对定位。因为第一个没设置层级大小，所以它的层级(z-index)大小为0，以至于设置了层级(z-index)大小为1的那个可以覆盖另一个。

例如:

        

 注释：定位没有设置叠层等级时，默认绝对、固定、相对定位层级等级z-index=0，这个时候就是按照定位顺序覆盖了，正常情况下固定定位会覆盖绝对定位，毕竟固定定位是固定在整个浏览器最上面的一层，当绝对定位想覆盖固定定位的时候，就可以设置比默认值z-index=0大的层级z-index=1，就可以覆盖固定定位了。如图：