一、z-index
只有定位(除了static)的盒子才有,才有z-index。
当都有定位的时候,层级默认是0,最后一个层级最高,还是会被压住,所以这时候加上z-index层级,才会改变层级。
这种方法可以解决,当有绝对定位的时候就不好用了:
/* .test {
width: 150px;
height: 300px;
border: 1px solid #ccc;
margin-top: 100px;
float: left;
margin-left: -1px;
}
.test:hover {
border: 1px solid #f40;
position: relative;
} */
正确的:
.test {
width: 150px;
height: 300px;
border: 1px solid #ccc;
margin-top: 100px;
float: left;
margin-left: -1px;
position: relative;
}
.test:hover {
border: 1px solid #f40;
z-index: 1;
}
二、
定位的盒子和父亲无关,不加宽度只和内容有关,只有标准流才会继承父亲。
三、
css3中的背景半透明
background:rgba(0,0,0,0.5) .5也可以
四、行内元素可以设置行高 不可以直接设置水平居中 text-align:center