一、說一下Css的盒子模型？
HTML中所有元素都可以看成是一個盒子
盒子的組成：content、padding、border、margin
盒子的類型：
- 標準盒模型：margin+border+padding+content?-- box-sizing：content-box（默認）
- IE盒模型：margin+content（border+padding）?-- box-sizing：border-box
二、Css選擇器的優先級？
Css的特性：繼承性、層疊性、優先級
不同級別下：
內聯樣式 > id選擇器 > 類選擇器、偽類選擇器 > 元素選擇器 > 通配符選擇器 > 瀏覽器自定義
相同級別內：
同一級別中后書寫 > 先書寫的
css的引入方式不同 => 優先級的不同 => 內部引入 > 外部 >導入引入
三、隱藏元素的方法有哪些？
- display：none（元素在頁面消失，不占據空間）
- opacity：0（透明度為0，占據空間）
- visibility：hidden? （元素消失，占據空間）
- position：absolute
四、px和rem的區別是什么？
px是像素，顯示器上呈現畫面的像素，絕對單位長度
rem是相對單位，相對于html根節點的font-size的值
五、重繪和重排有什么區別？
- 重排（回流）：布局引擎會根據所有樣式計算出盒模型在頁面的位置和大小
- 重繪：計算好盒模型的位置、大小和其他一些屬性，瀏覽器根據每個盒模型特性進行繪制
對DOM的大小、位置修改 => 重排
對DOM的樣式修改 => 重繪
六、讓一個元素水平垂直居中的方式有哪些？
- 定位 + margin
- 定位 + transform
left:0
right:0
transform:translate(-50%,-50%)- display
display:flex
justify-content:center
align-items:center- grid布局
- table局部
七、Css哪些屬性可以繼承，哪些不可以？
- 字體屬性：font
- 文本屬性：line-height
- 元素的可見性：visibility：hidden
- 表格布局的屬性：border-spacing
- 列表的屬性：list-style
- 聲音的樣式屬性
八、有沒有用過預處理器？
預處理語言增加了變量、函數、混入等強大的功能
SASS LESS
- 支持樣式嵌套
- 支持定義變量? --? @global：#eee;
