1. 浮動元素有什么特征？對父容器、其他浮動元素、普通元素、文字分別有什么影響?
- 浮動元素可以左右移動（根據(jù)float屬性值而定），直到它的外邊緣碰到包含框或者另一個(gè)浮動元素的框的邊緣。浮動元素不在文檔的普通流中，文檔的普通流中的元素表現(xiàn)的就像浮動元素不存在一樣。
- 父元素中元素都浮動時(shí)，父元素高度為0。
其他浮動元素會一起橫向排列，父容器寬度不足時(shí)，浮動元素會被擠到下一行。
文檔中的普通元素表現(xiàn)的就像浮動元素不存在一樣。浮動元素可能會覆蓋普通元素。
普通元素中的文字會感知到浮動元素，而給浮動元素流出空間。
2. 清除浮動指什么? 如何清除浮動? 兩種以上方法
- 指解決浮動父容器高度塌陷問題。
- 清除浮動
1.在浮動元素最后添加一個(gè)空div，對它設(shè)置clear:both樣式，缺點(diǎn)是增加了一個(gè)無意義的標(biāo)簽。
2.使父容器形成BFC清理浮動
BFC（Block Format Content）指塊級格式化上下文。
利用BFC可以包含浮動的特性來清除浮動，設(shè)置父容器形成BFC即可。例如：設(shè)置為overflow: hidden或display: inline-block.
3. 有幾種定位方式，分別是如何實(shí)現(xiàn)定位的，參考點(diǎn)是什么，使用場景是什么？
- 三種：普通流，相對定位和絕對定位
1.普通流是默認(rèn)定位方式，在普通流中元素框的位置由元素在html中的位置決定，元素position屬性為static或繼承來的static時(shí)就會按照普通流定位，這也是我們最常見的方式
2.相對定位比較簡單，對應(yīng)position屬性的relative值，如果對一個(gè)元素進(jìn)行相對定位，它將出現(xiàn)在他所在的位置上，然后可以通過設(shè)置垂直或水平位置，讓這個(gè)元素相對于它自己移動，在使用相對定位時(shí)，無論元素是否移動，元素在文檔流中占據(jù)原來空間，只是表現(xiàn)出來的位置會改變，相對定位可以看作特殊的普通流定位，元素位置是相對于它在普通流中位置發(fā)生變化。
3.絕對定位的元素的位置是相對于距離最近的非static祖先元素位置決定的。如果元素沒有已定位的祖先元素，那么他的位置就相對于初始包含塊html來定位，絕對定位使元素的位置與文檔流無關(guān)，也不占據(jù)文檔流空間，普通流中的元素布局就像絕對定位元素不存在一樣，因?yàn)榻^對定位與文檔流無關(guān)，所以絕對定位的元素可以覆蓋頁面上的其他元素。
4. z-index 有什么作用? 如何使用?
當(dāng)網(wǎng)頁上出現(xiàn)多個(gè)由絕對定位或固定定位所產(chǎn)生的浮動層時(shí)，當(dāng)這些層的位置產(chǎn)生重合時(shí)，這時(shí)候就可以通過設(shè)置z-index的值來解決，z-index屬性控制疊放順序，z-index越高，元素位置越靠上。
5. position:relative和負(fù)margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別?
- position:relative 本身還處在文檔流中，對其他元素沒有影響。
- 負(fù)margin方法使元素位置偏移，使元素在文檔流中的位置發(fā)生了改變，其后的元素受其影響。
6. BFC 是什么？如何生成 BFC？BFC 有什么作用？舉例說明
- BFC（Block Format Content）指塊級格式化上下文。
- 通過設(shè)置父容器為以下樣式可以生成BFC:
float為 left|right overflow為 hidden|auto|scroll display為 table-cell|table-caption|inline-block position為 absolute|fixed - BFC的作用
1.BFC 會阻止外邊距折疊
兩個(gè)相連的 div 在垂直上的外邊距會發(fā)生疊加,可以通過設(shè)置BFC來阻止外邊距折疊例如設(shè)置為overflow:hidden。
2.BFC 可以包含浮動的元素
使用overflow: hidden或overflow: auto觸發(fā)浮動元素的父元素的 BFC 特性，從而可以包含浮動元素，實(shí)現(xiàn)清除浮動。
3.BFC 可以阻止元素被浮動元素覆蓋
浮動元素會脫離文檔流，浮動元素的塊級兄弟元素會無視浮動元素的位置，盡量占滿一整行，這樣就會被浮動元素覆蓋，可以為該兄弟元素設(shè)置 BFC 后可以阻止這種情況的發(fā)生。
7. 在什么場景下會出現(xiàn)外邊距合并？如何合并？如何不讓相鄰元素外邊距合并？給個(gè)父子外邊距合并的范例
- 同一文檔流中的兩個(gè)上下相鄰塊級元素，會出現(xiàn)外邊距合并。合并后的外邊距的高度等于兩個(gè)發(fā)生合并的外邊距的高度中的較大者。
- 設(shè)置絕對定位能形成 BFC 可用來阻止外邊距合并。對于嵌套元素來說就很有必要了，只要把父元素設(shè)為BFC就可以了，這樣子元素的margin就不會和父元素的margin發(fā)生重疊。
例如：父子元素都設(shè)置了外邊距20px，父子元素發(fā)生了上外邊距合并.
通過給父元素設(shè)置overflow: hidden樣式,來解決外邊距合并問題。
