css——定位2

1. 层级

定位元素之间，如果出现覆盖问题，那么越到后面的元素优先级越高，当然我们可以使用z-index层级属性来调整优先级。

z-index属性只针对定位元素有效

取值为一个整数数字，默认auto 或 0 ，可正可负

2. 盒子居中

使用定位让元素在父级中居中的方式：

position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;

或者：

position: absolute;
top: 50%;
left: 50%;
margin-left: -自身宽度一半;
margin-top: -自身高度一半;

3. 补充

伪类选择器 :hover

<style>
  div{width: 100px; height: 100px; background-color: red}
  /*当鼠标移入div时，背景颜色变为blue*/
  div:hover{background-color: blue}
</style>
<div></div>