css实战第三天小结

1.谈一谈对层级的理解：

如果对两个并列的子元素都设置了相对于同一个父元素(如果没有设置父元素那么默认相对于浏览器而言)进行了定位（相对定位），则这两个都具有相同的层级（默认为0），他们的trbl也默认为0，此时后面的一个子元素会覆盖前面一个子元素：

效果：

如果想让前面的子元素显示在后面的一个子元素的上面，那么应该在上面一个子元素上设置z-index:1;

2．子盒子的居中算法：

效果图：

3.Overflow:hideen的使用：

当子元素的宽度或高度超出父元素的宽高时我们在一些情况下需要隐藏超出的部分，这时需要对父元素设置一个overflow:hidden.

未设置前：

设置后：

4.padding和margin

当行内元素嵌套在一个块级元素之中时，使用padding时需注意，盒子的宽高会被设置的padding值撑开，此时需要外面的父元素需减去撑开的值。

如果使用margin，则必须将行内元素转换成行内块级元素或是块级元素。