1.浮動元素有什么特征？對父容器软能、其他浮動元素迎捺、普通元素、文字分別有什么影響?
浮動模型也是一種可視化格式模型查排，浮動的框可以左右移動（根據(jù)float屬性值而定）凳枝，直到它的外邊緣碰到包含框或者另一個浮動元素的框的邊緣。浮動元素不在文檔的普通流中跋核，文檔的普通流中的元素表現(xiàn)的就像浮動元素不存在一樣岖瑰。
子元素都是浮動元素，那么父元素的高度度為0砂代，在浮動元素上锭环。其它浮動元素能感知到該浮動元素的存在，如果包含塊兒太窄無法容納水平排列的三個浮動元素泊藕，那么其它浮動塊兒向下移動,直到有足夠的空間辅辩，如果浮動元素的高度不同,那么向下移動的時候可能被卡住难礼。普通元素表現(xiàn)得好像浮動元素不存在一樣，在原來的位置玫锋，會被浮動元素覆蓋蛾茉。文本內(nèi)容會受到浮動元素的影響,會移動以留出空間。用術(shù)語說就是浮動元素旁邊的行框被縮短,從而給浮動元素留出空間,因而行框圍繞浮動框撩鹿。
2.清除浮動指什么? 如何清除浮動? 兩種以上方法
清除浮動指解決浮動父容器高度塌陷問題谦炬，使父元素視覺上包含浮動元素。
清除浮動的方法：
1.在最后添加一個空div节沦，對它添加clear：both键思；把父元素?fù)纹饋怼?br>
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)定位的疾党，參考點(diǎn)是什么，使用場景是什么惨奕？
inherit規(guī)定應(yīng)該從父元素繼承 position 屬性的值雪位；
static默認(rèn)值,沒有定位，元素出現(xiàn)在正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）梨撞；
relative生成相對定位的元素茧泪，相對于元素本身正常位置進(jìn)行定位,因此，left:20px會向元素的 left 位置添加20px聋袋；
absolute生成絕對定位的元素队伟，相對于static定位以外的第一個祖先元素（offset parent）進(jìn)行定位,元素的位置通過 left,top, right 以及 bottom屬性進(jìn)行規(guī)定；
fixed生成絕對定位的元素幽勒，相對于瀏覽器窗口進(jìn)行定位嗜侮。元素的位置通過 left, top, right 以及 bottom屬性進(jìn)行規(guī)定；
sticky CSS3新屬性啥容，表現(xiàn)類似position:relative和position:fixed的合體锈颗，在目標(biāo)區(qū)域在屏幕中可見時，它的行為就像position:relative; 而當(dāng)頁面滾動超出目標(biāo)區(qū)域時咪惠，它的表現(xiàn)就像position:fixed击吱，它會固定在目標(biāo)位置。
CSS有三種基本的定位機(jī)制：普通流遥昧，相對定位和絕對定位覆醇。
普通流是默認(rèn)定位方式朵纷，在普通流中元素框的位置由元素在html中的位置決定，元素position屬性為static或繼承來的static時就會按照普通流定位永脓，這也是最常見的方式袍辞。
相對定位對應(yīng)position屬性的relative值，如果對一個元素進(jìn)行相對定位常摧，它將出現(xiàn)在他所在的位置上搅吁，然后可以通過設(shè)置垂直或水平位置，讓這個元素相對于它自己移動落午，在使用相對定位時谎懦，無論元素是否移動，元素在文檔流中占據(jù)原來空間溃斋，只是表現(xiàn)出來的位置會改變界拦。相對定位可以看作特殊的普通流定位，元素位置是相對于它在普通流中位置發(fā)生變化盐类。
絕對定位使元素的位置與文檔流無關(guān)，也不占據(jù)文檔流空間呛谜，普通流中的元素布局就像絕對定位元素不存在一樣在跳。絕對定位的元素的位置是相對于距離最近的非static祖先元素位置決定的。如果元素沒有已定位的祖先元素隐岛，那么他的位置就相對于初始包含塊html來定位猫妙。
4.z-index 有什么作用? 如何使用?
z-index 屬性設(shè)置元素的堆疊順序。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面聚凹。z-index 僅能在定位元素上奏效（例如 position:absolute;）割坠，元素可擁有負(fù)的 z-index 屬性值。該屬性設(shè)置一個定位元素沿 z 軸的位置妒牙，z 軸定義為垂直延伸到顯示區(qū)的軸彼哼。如果為正數(shù)，則離用戶更近湘今，為負(fù)數(shù)則表示離用戶更遠(yuǎn)敢朱。可能的值：auto默認(rèn)摩瞎，堆疊順序與父元素相等拴签；number設(shè)置元素的堆疊順序；inherit規(guī)定應(yīng)該從父元素繼承 z-index 屬性的值旗们。
5.position:relative和負(fù)margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別
position:relative;相對自己原本的位置發(fā)生偏移蚓哩，不影響其它普通流中的元素，可能會出現(xiàn)空白上渴。負(fù)margin除了讓元素自身發(fā)生偏移還會影響其它普通流中的元素位置岸梨。
6.BFC 是什么喜颁？如何生成 BFC？BFC 有什么作用盛嘿？舉例說明
BFC(Block Formatting Contex)即塊級格式化上下文洛巢。當(dāng)涉及到可視化布局的時候，BFC提供了一個環(huán)境次兆，元素在這個環(huán)境中按照一定規(guī)則進(jìn)行布局稿茉。一個環(huán)境中的元素不會影響到其它環(huán)境中的布局。
浮動元素芥炭，絕對定位元素漓库，非塊級盒子的塊級容器（例如inline-blocks，table-cells园蝠，and table-captions）渺蒿，以及overflow屬性值不是“ visible”（visible是overflow的默認(rèn)值）的塊級盒子（視口除外），這些元素就會為他們的內(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ā)生疊加肯骇。當(dāng)兩個垂直外邊距相遇時窥浪，它們將形成一個外邊距祖很，合并后的外邊距的高度等于兩個發(fā)生合并的外邊距的高度中的較大者（全部都為正值取最大者，不全是正值時為最大正外邊距加負(fù)外邊距得到的值漾脂，兩個負(fù)值則取絕對值的最大值）假颇。當(dāng)一個元素出現(xiàn)在另一個元素上面時，第一個元素的下外邊距與第二個元素的上外邊距會發(fā)生合并骨稿。當(dāng)一個元素包含在另一個元素即父元素中時（假設(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形成的獨(dú)立空間。
父子外邊距合并的范例：
不讓外邊距合并的方法如上所述肥矢。
