css-技巧

【1】文本垂直居中

        height与line-height(行高)设置一样；

【2】轮廓-边框

        border会影响可见框大小，outline轮廓不会影响(即不影响布局)；

【3】浮动

        float会使得元素不在工作流中，下面的元素占据其位置；float是元素位于父元素的相对位置。float使得父元素width=子元素width+margin+padding+border，margin-right默认自动扩充满父元素宽度；

        多个float同级元素，可以并排排列；

【4】高度崩塌+BFC

        

        采用最小损害的方法：同级元素，设置clear，消除float浮动元素对他的影响；

        但是Html应该各自负责各自的事情，那么应该用css伪元素(::after，默认行内元素，应该修改display)来添加；

        针对外边距一起下滑，高度崩塌问题更优的解决思路如下：before+content+display解决外边距，after+content+display解决高度崩塌