css居中的书写规范——2017.3.4

元素的定位属性


定位模式

选择器{position: 属性值;}

postition属性的常用值


static 自动定位

relative 相对定位,相对于其源文档流的位置进行定位

absolute绝对定位,相对于上一个已将定位的父元素定位

fixed 固定定位,相对于浏览器窗口进行定位


相对定位

.box2{

               position: relative;

               right: -30px;

               top: -30px;


          }


绝对定位

子绝父相

.wrap{

               background-color: #09c;

               width: 400px;

               position: relative;

          }

 .close{

               width: 20px;

               height: 20px;

               position: absolute;

               top: 0;

               right: 0;


          }



z-index层叠等级属性

当对多个元素同时设置定位时,定位元素之间有可能发生重叠

在css中,要想调整重叠定位元素的堆叠顺序,可以对定位元素应用z-index层叠等级属性,其取值可为正整数,负整数和0

z-index的默认值属性值是0,取值越大,定位元素在层叠元素中越居上。

定义靠后的,默认在之前的元素之上。不要滥用z-index;

父容器的z-index会影响子元素的层级级别。

你可能感兴趣的:(css居中的书写规范——2017.3.4)