1、選擇器權重問題；
html
! important>內聯樣式（1，0，0，0）>id選擇器（0，1，0，0）>類選擇器、屬性選擇器、僞類選擇器(0,0,1,0)>元素選擇器、僞對象(0,0,0,1)> 通配符選擇器（0，0，0，0）>繼承的屬性>瀏覽器默認樣式。
2、盒模型的理解瀏覽器
全部HTML元素能夠看做盒子，在CSS中，"box model"這一術語是用來設計和佈局時使用。佈局
margin(外邊距) - 清除邊框外的區域，外邊距是透明的。 性能
border(邊框) - 圍繞在內邊距和內容外的邊框。
padding(內邊距) - 清除內容周圍的區域，內邊距是透明的。
content(內容) - 盒子的內容，顯示文本和圖像。
在標準的盒子模型中，width指content部分的寬度 字體
在IE盒子模型中，width表示content+padding+border這三個部分的寬度 flex
3、使用display：none和visibility：hidden隱藏的區別spa
1.display:none是完全消失，不在文檔流中佔位，瀏覽器也不會解析該元素；visibility:hidden是視覺上消失了，能夠理解爲透明度爲0的效果，在文檔流中佔位，瀏覽器會解析該元素；
2.使用visibility:hidden比display:none性能上要好，display:none切換顯示時visibility，頁面產生迴流（當頁面中的一部分元素須要改變規模尺寸、佈局、顯示隱藏等，頁面從新構建，此時就是迴流。全部頁面第一次加載時須要產生一次迴流），而visibility切換是否顯示時則不會引發迴流。
4、文檔流，脫離文檔流的方法.net
文檔流：將窗體自上而下分紅一行一行，並在每行中按從左至右依次排放元素，稱爲文檔流，也稱爲普通流。設計
脫離文檔流：元素脫離文檔流以後，將再也不在文檔流中佔據空間，而是處於浮動狀態（能夠理解爲漂浮在文檔流的上方）。脫離文檔流的元素的定位基於正常的文檔流，當一個元素脫離文檔流後，依然在文檔流中的其餘元素將忽略該元素並填補其原先的空間。orm
脫離文檔流的三個方法：
1.float
2.fixed
3.absolute
5、描述一下浮動的原理和如何清除浮動
6、請求首部
https://www.cnblogs.com/jycboy/archive/2017/02/17/http_head.html
https://blog.csdn.net/holmofy/article/details/68492045
7、Repaint與reflow是什麼
Reflow（渲染）: 對於每一個DOM結構中的各個元素都有本身的盒子（模型），這些都須要瀏覽器根據各類樣式（瀏覽器的，開發人員定義的）來計算並根據計算結果將元素放到它出現的位置，這個過程稱爲 reflow。
Repaint（重繪）:當各類盒子的位置、大小以及其餘屬性，例如顏色、字體大小都肯定下來後，瀏覽器便把這些元素都按照各自的特性繪製了一遍，因而頁面的內容出現了，這個過程稱之爲repaint.
https://www.cnblogs.com/yunshangwuyou/p/9580712.html
8、邊距重疊解決方案(BFC)
舉一個邊距重置的例子：父元素沒有設置margin-top，而子元素設置了margin-top：20px;能夠看出，父元素也一塊兒有了邊距。
首先要明確BFC是什麼意思，其全英文拼寫爲 Block Formatting Context 直譯爲「塊級格式化上下文」
BFC的原理
1.內部的box會在垂直方向，一個接一個的放置
2.每一個元素的margin box的左邊，與包含塊border box的左邊相接觸（對於從作往右的格式化，不然相反）
3.box垂直方向的距離由margin決定，屬於同一個bfc的兩個相鄰box的margin會發生重疊
4.bfc的區域不會與浮動區域的box重疊
5.bfc是一個頁面上的獨立的容器，外面的元素不會影響bfc裏的元素，反過來，裏面的也不會影響外面的
6.計算bfc高度的時候，浮動元素也會參與計算
怎麼取建立bfc
1.float屬性不爲none（脫離文檔流）
2.position爲absolute或fixed
3.display爲inline-block,table-cell,table-caption,flex,inine-flex
4.overflow不爲visible
5.根元素
應用場景
1.自適應兩欄佈局
2.清除內部浮動
3.防止垂直margin重疊
1.BFC的使用場景–能夠用來自適應佈局。
<!-- BFC不與float重疊 -->
<
section
id=
"layout"
>
<
style
media=
"screen"
>
#layout{
background:
red;
}
#layout .left{
float:
left;
width:
100px;
height:
100px;
background:
#664664;
}
#layout .right{
height:
110px;
background:
#ccc;
overflow:
auto;
}
<
/
style
>
<
div
class=
"left"
></
div
>
<
div
class=
"right"
></
div
>
<!-- 利用BFC的這一個原理就能夠實現兩欄佈局，左邊定寬，右邊自適應。不會相互影響，哪怕高度不相等。 -->
</
section
>
2.BFC的使用場景–能夠清除浮動：
<!-- BFC子元素即便是float也會參與計算 -->
<
section
id=
"float"
>
<
style
media=
"screen"
>
#float{
background:
#434343;
overflow:
auto;
}
#float .float{
float:
left;
font-size:
30px;
}
<
/
style
>
<
div
class=
"float"
>我是浮動元素
</
div
>
</
section
>
1.BFC的使用場景–
解決垂直邊距重疊：
<
section
class=
"top"
>
<
h1
>上
</
h1
>
margin-bottom:30px;
</
section
>
<!-- 給下面這個塊添加一個父元素，在父元素上建立bfc -->
<
div
style=
"
overflow:hidden"
>
<
section
class=
"bottom"
>
<
h1
>下
</
h1
>
margin-top:50px;
</
section
>
</
div
>