1.浮動元素有什么特征？對父容器、其他浮動元素、普通元素、文字分別有什么影響?
浮動元素會脫離標準的文檔流，浮動的框可以左右移動直到碰到包含框或者另一個浮動元素框的邊緣，普通的文檔流中的元素會表現出浮動元素不存在一樣。浮動之后也不區分行內或者塊級元素。
- 對父容器的影響：如果父容器未設置高度，子元素浮動的話會讓父元素的高度產生坍塌。
- 對其他浮動元素的影響：同一個方向浮動的元素會在一行緊緊的貼著，如果寬度不夠的話就會自動換行；反方向的話會在同一行左右兩側。如果高度設置存在問題也有可能出現‘卡住’的現象換行和卡住。
- 對普通元素及文本：普通元素會占據浮動元素未浮動時的位置，并且浮動元素會覆蓋普通元素，但普通元素的文字不會被覆蓋，會環繞在浮動元素四周排列。
2.清除浮動指什么? 如何清除浮動? 兩種以上方法
如果浮動元素的父元素未設置高度，那么就會出現父元素高度坍塌，清除浮動主要是為了清除浮動帶來的負面影響；
清除浮動主要是兩種方法：
- clear:left,both,right; 不允許元素的左右出現浮動元素。
- BFC:主要是讓父元素形成BFC來達到包含浮動的目的，方法有：overflow:hidden;
float:left,right; display:table-cell; position:absolute;但也有局限性主要是低版本的IE兼容問題；
通常用的清除浮動方法：
.clearfix{
*zoom:1;
}
.clearfix:after{
content:' ';
display: block;
clear:both;
}
3.有幾種定位方式，分別是如何實現定位的，參考點是什么，使用場景是什么？
三種基本的定位機制：普通定位；相對定位(position:relative)；絕對定位(position:absolute)；絕對定位里有種特殊情況叫固定定位(position:fixed);
- inherit：規定從父元素繼承position屬性。
- 默認值static：默認值,沒有定位，元素出現在正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）。
- 相對定位relative：不脫離標準流，相對于自身存在的位置移動，并且移動后原有位置仍被該元素占據，使用場景一般是為絕對定位設置參照物。
- 絕對定位absolute：脫離標準流，相對于距離最近的非static祖先元素的位置決定的，如果沒有定位的祖先元素那么就相對于初始包含塊html來定位。
- 固定定位fixed：脫離標準流，相對于可視窗口來定位的。比如一般一些網站上的小的導航條。
- sticky：CSS3新屬性，表現類似于position: relative和position: fixed的合體；當目標區域在屏幕中可見時，行為類似于position: relative，當頁面滾動超過目標區域,行為類似于position: fixed，會固定在目標位置，但是瀏覽器支持sticky的版本并不多。
4.z-index 有什么作用? 如何使用?
- z-index設置定位元素顯示的層次順序，z-index值越大，元素的位置越靠上。
- 如果都沒有設置z-index那么誰寫在后面誰的優先級就高，ps定位的元素可以蓋住沒有定位的元素。
5.position:relative和負margin都可以使元素位置發生偏移?二者有什么區別
- position: relative使元素發生偏移但是元素仍舊占據原有的位置，后面的元素無法填充空出的位置；
- 負margin會使后續的元素填充原來占有的位置。
6.BFC 是什么？如何生成 BFC？BFC 有什么作用？舉例說明
- BFC塊級格式化上下文，就是頁面上的一個隔離的渲染區域，容器里面的子元素不會在布局上影響到外面的元素，反之也是如此。
- 產生BFC：float的值不為none。overflow的值不為visible。 position的值不為relative和static。display的值為table-cell, table-caption, inline-block中的任何一個。
- 作用：1.BFC會阻止外邊距的合并，外邊距合并發生的主要原因是因為同處在同一個BFC中，只要讓它們處在不同的BFC就可以阻止垂直margin合并；
2.BFC不會重疊浮動元素；比如可以讓文字等行內元素不環繞浮動元素。
3.BFC可以包含浮動。因為BFC可以包含浮動，所以讓父容器生成新的BFC可以讓父容器在視覺上包圍了浮動的子元素，因而清除了浮動。每種清除浮動的方法都會帶來相應的副作用，沒有最好的只有最合適的。
7.在什么場景下會出現外邊距合并？如何合并？如何不讓相鄰元素外邊距合并？
1.當兩個垂直margin合并時（包括相鄰元素和嵌套元素），會形成外邊距合并,margin如果都為正會取兩者的最大值，如果都為負取絕對值最大的，如果一正一負取兩者之和。
2.嵌套關系的話可以給父元素設置邊框或者padding來阻止外邊距合并，相鄰元素的話可以讓兩個元素處在不同的BFC中來達到阻止外邊距合并的目的。
