1.浮動元素有什么特征？對父容器、其他浮動元素、普通元素、文字分別有什么影響?
浮動模型也是一種可視化格式模型，浮動的框可以左右移動（根據(jù)float屬性值而定），直到它的外邊緣碰到包含框或者另一個浮動元素的框的邊緣。浮動元素不在文檔的普通流中，文檔的普通流中的元素表現(xiàn)的就像浮動元素不存在一樣。
子元素都是浮動元素，那么父元素的高度度為0，在浮動元素上。其它浮動元素能感知到該浮動元素的存在，如果包含塊兒太窄無法容納水平排列的三個浮動元素，那么其它浮動塊兒向下移動,直到有足夠的空間，如果浮動元素的高度不同,那么向下移動的時候可能被卡住。普通元素表現(xiàn)得好像浮動元素不存在一樣，在原來的位置，會被浮動元素覆蓋。文本內(nèi)容會受到浮動元素的影響,會移動以留出空間。用術(shù)語說就是浮動元素旁邊的行框被縮短,從而給浮動元素留出空間,因而行框圍繞浮動框。
2.清除浮動指什么? 如何清除浮動? 兩種以上方法
清除浮動指解決浮動父容器高度塌陷問題，使父元素視覺上包含浮動元素。
清除浮動的方法：
1.在最后添加一個空div，對它添加clear：both；把父元素撐起來。
2.利用BFC清除浮動。生成新的BFC包圍浮動元素。對父容器設(shè)置以下屬性：float為 left|right，overflow為 hidden|auto|scroll，display為 table-cell|table，caption|inline-block，position為 absolute|fixed都可以形成BFC。
3.通用的清除浮動法案
.clearfix{ zoom:1;}
.clearfix:after{content:""; display:block;clear:left; } 或
.clearfix{zoom:1; }
.clearfix:after{content:"";display:table;clear:both;}
3.有幾種定位方式，分別是如何實現(xiàn)定位的，參考點是什么，使用場景是什么？
inherit規(guī)定應(yīng)該從父元素繼承 position 屬性的值；
static默認值,沒有定位，元素出現(xiàn)在正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）；
relative生成相對定位的元素，相對于元素本身正常位置進行定位,因此，left:20px會向元素的 left 位置添加20px；
absolute生成絕對定位的元素，相對于static定位以外的第一個祖先元素（offset parent）進行定位,元素的位置通過 left,top, right 以及 bottom屬性進行規(guī)定；
fixed生成絕對定位的元素，相對于瀏覽器窗口進行定位。元素的位置通過 left, top, right 以及 bottom屬性進行規(guī)定；
sticky CSS3新屬性，表現(xiàn)類似position:relative和position:fixed的合體，在目標區(qū)域在屏幕中可見時，它的行為就像position:relative; 而當頁面滾動超出目標區(qū)域時，它的表現(xiàn)就像position:fixed，它會固定在目標位置。
CSS有三種基本的定位機制：普通流，相對定位和絕對定位。
普通流是默認定位方式，在普通流中元素框的位置由元素在html中的位置決定，元素position屬性為static或繼承來的static時就會按照普通流定位，這也是最常見的方式。
相對定位對應(yīng)position屬性的relative值，如果對一個元素進行相對定位，它將出現(xiàn)在他所在的位置上，然后可以通過設(shè)置垂直或水平位置，讓這個元素相對于它自己移動，在使用相對定位時，無論元素是否移動，元素在文檔流中占據(jù)原來空間，只是表現(xiàn)出來的位置會改變。相對定位可以看作特殊的普通流定位，元素位置是相對于它在普通流中位置發(fā)生變化。
絕對定位使元素的位置與文檔流無關(guān)，也不占據(jù)文檔流空間，普通流中的元素布局就像絕對定位元素不存在一樣。絕對定位的元素的位置是相對于距離最近的非static祖先元素位置決定的。如果元素沒有已定位的祖先元素，那么他的位置就相對于初始包含塊html來定位。
4.z-index 有什么作用? 如何使用?
z-index 屬性設(shè)置元素的堆疊順序。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面。z-index 僅能在定位元素上奏效（例如 position:absolute;），元素可擁有負的 z-index 屬性值。該屬性設(shè)置一個定位元素沿 z 軸的位置，z 軸定義為垂直延伸到顯示區(qū)的軸。如果為正數(shù)，則離用戶更近，為負數(shù)則表示離用戶更遠。可能的值：auto默認，堆疊順序與父元素相等；number設(shè)置元素的堆疊順序；inherit規(guī)定應(yīng)該從父元素繼承 z-index 屬性的值。
5.position:relative和負margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別
position:relative;相對自己原本的位置發(fā)生偏移，不影響其它普通流中的元素，可能會出現(xiàn)空白。負margin除了讓元素自身發(fā)生偏移還會影響其它普通流中的元素位置。
6.BFC 是什么？如何生成 BFC？BFC 有什么作用？舉例說明
BFC(Block Formatting Contex)即塊級格式化上下文。當涉及到可視化布局的時候，BFC提供了一個環(huán)境，元素在這個環(huán)境中按照一定規(guī)則進行布局。一個環(huán)境中的元素不會影響到其它環(huán)境中的布局。
浮動元素，絕對定位元素，非塊級盒子的塊級容器（例如inline-blocks，table-cells，and table-captions），以及overflow屬性值不是“ visible”（visible是overflow的默認值）的塊級盒子（視口除外），這些元素就會為他們的內(nèi)容創(chuàng)建一個BFC。即float為 left|right，overflow為 hidden|auto|scroll，display為 table-cell|table-caption|inline-block，position為 absolute|fixed。
作用：
1.解決margin疊加問題 。只有同屬于一個BFC時，兩個元素才有可能發(fā)生垂直Margin的重疊，這個包括相鄰元素，嵌套元素，只要他們之間沒有阻擋(例如邊框，非空內(nèi)容，padding等)就會發(fā)生margin重疊，這時生成新的BFC讓元素在不同的BFC中就能解決疊加問題。
2.清除浮動。BFC可以包含浮動元素，讓父元素生成新的BFC就可以包圍浮動元素。
3.創(chuàng)建自適應(yīng)布局。BFC不會重疊浮動元素。利用該特性可以作為多欄布局的一種實現(xiàn)方式。
7.在什么場景下會出現(xiàn)外邊距合并？如何合并？如何不讓相鄰元素外邊距合并？給個父子外邊距合并的范例。
兩個或多個毗鄰（父子元素或兄弟元素）的普通流中的塊元素垂直方向上的 margin 會發(fā)生疊加。當兩個垂直外邊距相遇時，它們將形成一個外邊距，合并后的外邊距的高度等于兩個發(fā)生合并的外邊距的高度中的較大者（全部都為正值取最大者，不全是正值時為最大正外邊距加負外邊距得到的值，兩個負值則取絕對值的最大值）。當一個元素出現(xiàn)在另一個元素上面時，第一個元素的下外邊距與第二個元素的上外邊距會發(fā)生合并。當一個元素包含在另一個元素即父元素中時（假設(shè)沒有內(nèi)邊距或邊框把外邊距分隔開），它們的上和/或下外邊距也會發(fā)生合并。外邊距甚至可以與自身發(fā)生合并，假設(shè)有一個空元素，它有外邊距，但是沒有邊框或填充，在這種情況下，上外邊距與下外邊距就碰到了一起，它們會發(fā)生合并，如果這個外邊距遇到另一個元素的外邊距，它還會發(fā)生合并。只有普通文檔流中塊框的垂直外邊距才會發(fā)生外邊距合并。行內(nèi)框、浮動框或絕對定位之間的外邊距不會合并。
不讓相鄰元素外邊距合并：設(shè)置浮動定位display overflow等生成BFC使其不合并；給父元素設(shè)置border，padding間隔可以使外邊距不合并。相鄰兄弟間可使用同一方向上的margin設(shè)定如都設(shè)置margin-top或margin-bottom。不讓兩個元素的外邊距合并，就要讓它們之間有道分界線，這個分界線可以是border，padding或是bfc形成的獨立空間。
父子外邊距合并的范例：
不讓外邊距合并的方法如上所述。
