1. 浮動元素的特征，對其他浮動元素、普通元素、文字的影響
浮動模型是一種可視化格式模型，浮動元素可以左右移動（根據float屬性值而定），直到它的外邊緣碰到包含框或者另一個浮動元素的框的邊緣。浮動元素不在文檔的普通流中，文檔的普通流中的元素表現的就像浮動元素不存在一樣.
- 對父元素的影響：正常情況下即在沒有浮動的時候，父元素的高度由子元素來撐開，元素浮動之后，父元素中好像什么都沒了，高度消失。
- 對其他浮動元素的影響：多個浮動元素相鄰，如果包含塊太窄無法容納水平排列的全部浮動元素，那么其它浮動元素會向下移動，直到有足夠的空間，而如果浮動元素的高度不同，那么向下移動的時候可能會被卡住。
- 對普通元素的影響：普通元素在占據浮動元素原來占據的空間，并被浮動元素遮擋。
- 文字的影響：文字可以發現浮動元素，并留出空間。
2.清除浮動指什么？如何清除浮動？
清除浮動是指消除浮動元素對其父元素因浮動造成的高度塌陷的問題。
- 在父元素最后添加一個空的div，并設置屬性
clear:both.但是這種方法并不好，會添加一個無意義的標簽。 - BFC清除，給父元素添加以下屬性使其生成一個BFC包圍浮動元素
- float:left/right
- overflow:hidden/auto/scrool
- display: table-cell / table-caption / inline-block
- position: absolute / fixed
- 最常見的最實用的清除浮動方式和1類似，不過是用偽元素代替div，給父元素添加一個類，如clearfix，再給這個類添加以下樣式：
.clearfix{
*zoom:1; /*使ie6，7的hasLayout為true,達到和BFC相同效果*/
}
.clearfix:after{
content:"";
display:table;
clear:both;
}
3.定位方式
| 方式 | 屬性 | 參考點 | 使用場景
| ---
|static| 默認文檔流，不定位 | / | 正常文檔流
| relative | 生成相對定位的元素，相對于元素本身正常位置進行定位 | 本身正常位置 | 為絕對定位設定參照物或對元素自身位置進行局部調整
| absolute | 生成絕對定位元素，相對于static定位以外的第一個祖先元素（offset parent）進行定位,元素的位置通過left,top,right以及bottom屬性進行規定 | 非static定位的第一個祖先元素 | 當想讓元素參照特定參照物進行定位時使用
| fixed | 生成絕對定位的元素，相對于瀏覽器窗口進行定位。元素的位置通過left,top,right以及bottom屬性進行規定 | viewport | 當需要相對于viewport進行定位時使用
4.z-index的作用
z-index是有定位屬性relative/absolute/fixed的元素才起作用，值越大的越排在上面，z-index值大的定位元素可以遮擋住值小的元素。也就是說z-index的使用要配合position:relative/absolute/fixed來使用。
補充：z-index的比較是在同級元素之間進行，具體可見例子：http://js.jirengu.com/ceheqetofu/2/edit
d2的z-index最大，可是并不是在最上面，可見是先比較都是父級且為兄弟元素d1和d3的層級關系。還有一點比較在意，如果d1的z-index不設置，那么就比較d2與d3的z-index http://js.jirengu.com/mesupolozo/4/edit 。大多情況是比較兄弟 元素之間的層級的
5.position:relative和負margin使元素偏移的區別
- position:relative元素偏移前的空間還保留在那，視覺上發生偏移，也就是說這種方式不會影響文檔流。
- 負margin是真正的發生了偏移，原來的位置不復存在，影響了文檔流。
6.BFC是什么？如何生成？有什么作用？
BFC（Block Format Content），即塊級格式化上下文。對浮動、定位（絕對定位、固定定位）元素、塊級容器（如inline-block、 table-cell、table-caption）并不是塊級盒子，還包括那些overflow屬性值取值visible以外的塊級盒子，會為它們的內容創建一個新的塊級格式化上下文。
-
生成BFC可以給元素加以下屬性
- float:left/right
- overflow:hidden/auto/scrool
- display: table-cell / table-caption / inline-block
- position: absolute / fixed
-
BFC的作用
- BFC可以解決margin重疊問題。margin重疊是指處于同一個BFC的相鄰元素、嵌套元素，只要它們之間沒有阻擋（如：邊框、非空內容、padding等）就會發生margin重疊。這時只要讓其中一個元素生成新的BFC就能解決margin重疊問題。
- BFC可以清除浮動影響。因為BFC可以包含浮動，所以讓父容器生成新的BFC可以讓父容器在視覺上包圍了浮動的子元素，因而清除了子元素浮動造成父容器高度塌陷問題。
7.在什么場景下會出現外邊距合并？如何合并？如何不讓相鄰元素外邊距合并？
外邊距合并：當兩個垂直外邊距相遇時，即當一個元素出現在另一個元素上面時，第一個元素的下外邊距與第二個元素的上外邊距會發生合并，它們將形成一個外邊距合并后的外邊距的高度等于兩個發生合并的外邊距的高度中的較大者。
- 相鄰兄弟元素
如例子中 http://js.jirengu.com/sitinevulo/2/edit ，總高度是350px,div1高200px，div2高100px,div1的下邊距是50px，常理來說，此時div2的上邊距為0才能保證div2不超出大div的范圍，但例子中div2也確實有20px的上邊距，結果是即使有20px的上邊距div2也沒有超出大div，原因就是邊距發生了重疊，并取了其中較大者。要使其不合并，就如下面例子 http://js.jirengu.com/najuvogowa/2/edit 給div2添加float屬性生成新的BFC即可 - 父子元素
如例 http://js.jirengu.com/bakobovopa/2/edit ,大div沒有上邊距，div1有上邊距50px，兩者合并，取了較大值div1的上邊距50px，所以大div距離頂部50px，解決方法同樣的，給div1添加float屬性即可http://js.jirengu.com/zoguxodayo/2/edit
補充：當要合并的margin其中一個為負值的時候，要計算一下，不是簡單的取大值（正值，負值當然比正值小），計算方法相加，得出最終的合并后的margin值 http://js.jirengu.com/hibetateyo/2/edit 。當兩個都為負值的時候，就取絕對值大margin值那個負margin http://js.jirengu.com/zezesuyaje/2/edit 。
