css面试题

1.css中的哪些单位

  绝对单位：

   px:像素单位

  相对单位：

    em: 相对父元素字体大小

    rem:相对根元素字体大小

2.居中的方式

1.水平居中

　　1.设置盒子： margin:0 auto

　　2.display:  flex

2.垂直居中

     1.vertical-align: middle 实现居中，1. display: inline-block才会生效 2.需要参考兄弟元素的中心点

     2.绝对定位实现+transform

     3.弹性盒子：1.flex 

                           2.grid

3.隐藏元素的方式总结

  1.完全隐藏：1.dispalay:none

                       2.hidden;

  2.视觉隐藏：1.visibility: hidden;

                        2.opacity:0

                        3.透明度设置

                        3.绝对定位，移除视口外

                        4.margin-left ,移除视口外

                        5.宽高设置 0

  3.语义隐藏：aria-hidden:true

4.浮动

  1.作用：文字环绕（文章中使用较多）

  2.特性

        1.脱离标准流（位置就空了）

        2.浮动元素相互贴靠性（宽度不够换行）

        3.宽度收缩

        4.清除浮动（副作用）

           1.父元素设置高度(大于浮动元素高度)

           2.clear

           3.隔墙法（空div元素设置清除浮动）

          4.内墙法（高度坍塌）

          5.父元素设置overflow:hidden （BFC）

          6.父元素设置伪元素，清除浮动

5.BFC

  1.BFC是一个独立的布局环境，BFC内部的元素布局与外部相互不影响

  2.BFC布局规则：

 3.BFC形成规则：

     1.float: right left

     2.positon: absoult fixed

     3.overflow: auto scroll hidden

     4.display : inline-block table-cell

4.作用：

   1.解决高度坍塌问题

   2.不会于浮动元素重叠

   3.外边距margin重叠 问题

 6.样式计算过程

  　1.确定声明值

      2.层叠冲突

      3.使用继承

     4.使用默认值