加了定位后的块级元素居中和层次叠放

.news-list {
/块级元素居中/
margin:50px auto;(50px控制上边距,auto居中)如果使用了绝对定位,margin:0 auto;无效
}

.fa .son {
width: 200px;
height: 200px;
border:1px solid orange;
background-color: pink;
/* margin:0 auto; */
position:absolute;
left:50%;
bottom:50%;
margin-left:-100px;
margin-bottom:-100px;
}
.nav ul {
width:840px;
height:100px;
background-color: #000;
position:absolute;
bottom:3px;
left:50%;
margin-left:-420px;

绝对定位的居中,left给50%,margin-left给父元素宽度的一半。

给元素添加绝对定位或者固定定位,此时元素转换为行内块元素了

创建结构的快捷方式:.new-list>ul>li*4 tab键生成

叠放次序(z-index)
在CSS中,要想调整重叠定位元素的堆叠顺序,可以对定位元素应用z-index层叠等级属性,其取值可为正整

数、负整数和0。

比如: z-index: 2;

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

  2. 如果取值相同,则根据书写顺序,后来居上。

  3. 后面数字一定不能加单位。

  4. 只有相对定位,绝对定位,固定定位有此属性,其余标准流,浮动,静态定位都无此属性,亦不可指定

此属性。

你可能感兴趣的:(加了定位后的块级元素居中和层次叠放)