1.浮動元素有什么特征捏境？對父容器于游、其他浮動元素、普通元素垫言、文字分別有什么影響?
答：浮動模型也是一種可視化格式模型贰剥，浮動的框可以左右移動（根據(jù)float屬性值而定），直到它的外邊緣碰到包含框或者另一個浮動元素的框的邊緣筷频。浮動元素不在文檔的普通流中蚌成，文檔的普通流中的元素表現(xiàn)的就像浮動元素不存在一樣前痘。
對父容器的影響：如果父元素只包含浮動元素，且父元素未設(shè)置高度和寬度的時候笑陈。那么它的高度就會塌縮為零际度，也就是所謂的“父容器塌陷”。（如下圖所示）
其他浮動元素的影響：浮動元素會按照順序排列下去涵妥，若父容器剩余的寬度不夠放下下一個浮動元素乖菱，那么它將向下移動，若是高度不同蓬网，在下移的過程中窒所，浮動元素還有可能會被卡住。(如下圖所示）
對普通元素的影響：普通元素?zé)o法感知到浮動元素帆锋，會被浮動元素遮擋（如下圖所示吵取，box3被遮擋住了）
對文字的影響：文字可以感知浮動元素，會圍繞浮動元素(如下圖所示）
2.清除浮動指什么? 如何清除浮動? 兩種以上方法
答：清除浮動是指清除由于子元素浮動帶來父元素高度塌陷的影響锯厢。
兩種方法：
1.如果我們想讓父元素在視覺上包圍浮動元素可以像下面這樣處理皮官，在最后添加一個空div,對它清理，缺點(diǎn)是增加了一個無意義的標(biāo)簽实辑。(如下圖）
2.利用偽元素清除浮動(如下圖所示）
3.利用BFC清理浮動(如下圖）
3.有幾種定位方式捺氢，分別是如何實(shí)現(xiàn)定位的，參考點(diǎn)是什么剪撬，使用場景是什么摄乒？
CSS有三種基本的定位機(jī)制：普通流、相對定位和絕對定位
1.普通流是默認(rèn)定位方式残黑，在普通流中元素框的位置由元素html中的位置決定馍佑，元素position屬性為static或繼承來的static時就會按照普通流定位，這也是我們最常見的方式梨水。
2.相對定位比較簡單拭荤，對應(yīng)position屬性的relative值，如果對一個元素進(jìn)行相對定位疫诽，它將出現(xiàn)在它所在的位置上穷劈，然后可以通過設(shè)置垂直或水平位置，讓這個元素相對于它自己移動踊沸，在使用相對定位時歇终，無論元素是否移動，元素在文檔流中占據(jù)原來空間逼龟，只是表現(xiàn)出來的位置會改變评凝。
3.絕對定位與固定定位
● 相對定位可以看作特殊的普通流定位，元素位置是相對于它在普通流中的位置發(fā)生變化腺律，而絕對定位使元素的位置與文檔流無關(guān)奕短，也不占據(jù)文檔流空間宜肉，普通流中的元素布局就像絕對定位元素不存在一樣。
● 絕對定位的元素的位置是相對于距離最近的非static祖先元素位置決定的翎碑。如果元素沒有已定位的祖先元素谬返，那么他的位置就相對于初識包含塊html來定位。
● 因?yàn)榻^對定位與文檔流無關(guān)日杈，所以絕對定位的元素可以覆蓋頁面上的其他元素遣铝，可以通過z-index屬性控制疊放順序，z-index越高莉擒，元素位置越靠上酿炸。
● fixed固定定位，固定定位是絕對定位的一種涨冀，固定定位的元素也不包含在普通文檔流中填硕，差異是固定元素的包含塊兒是視口（viewport)
4.z-index 有什么作用? 如何使用?
答：z-index 屬性設(shè)置元素的堆疊順序。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面鹿鳖。
注釋：元素可擁有負(fù)的 z-index 屬性值扁眯。
注釋：Z-index 僅能在定位元素上奏效（例如 position:absolute、relative翅帜、fixed）
該屬性設(shè)置一個定位元素沿 z 軸的位置恋拍，z 軸定義為垂直延伸到顯示區(qū)的軸。如果為正數(shù)藕甩，則離用戶更近，為負(fù)數(shù)則表示離用戶更遠(yuǎn)周荐。
5.position:relative和負(fù)margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別
position:relative是相對于自身在文檔流的位置發(fā)生偏移狭莱，原本所占有的位置不會被其他元素占據(jù)，外形發(fā)生了移動但本身的位置是不動的概作；而負(fù)margin則文檔流的位置會發(fā)生偏移腋妙，會讓后面的元素也發(fā)生位置的偏移。
6.BFC 是什么讯榕？如何生成 BFC骤素？BFC 有什么作用？舉例說明
BFC全稱是Block Format Content愚屁，塊級格式化上下文
BFC特性：具有BFC特性的元素可以看作是隔離了的獨(dú)立容器济竹，容器里面的元素不會在布局上影響到外面的元素，并且BFC具有普通容器所沒有的一些特性霎槐。
通俗一點(diǎn)來講送浊，可以把BFC理解為一個封閉的大箱子，箱子內(nèi)部的元素?zé)o論如何翻江倒海都不會影響到外部丘跌。
觸發(fā)BFC：
只要滿足元素下面任一條件即可觸發(fā)BFC特性：
● body根元素
● 浮動元素：float除none以外的值
● 絕對定位元素：position(absolute袭景、fixed)
● display為inline-block唁桩、table-cells、flex
● overflow除了visible以外的值(hidden耸棒、auto荒澡、scroll)
BFC作用：
● 同一個BFC下外邊距會發(fā)生折疊，如果想要避免外邊距的重疊与殃，可以將其放在不同的BFC容器中单山。
● BFC可以包含浮動的元素（清除浮動）
● BFC可以阻止元素被浮動元素覆蓋
1、BFC會阻止垂直外邊距（margin-top奈籽、margin-bottom)折疊
按照BFC的定義饥侵，只有同屬于一個BFC時，兩個元素才有可能發(fā)生垂直margin的重疊衣屏，這個包括相鄰元素躏升，嵌套元素，只要他們之間沒有阻擋（例如邊框狼忱，非空內(nèi)容膨疏，paading等）就會發(fā)生magin重疊
因此要解決margin重疊問題，只要讓它們不在同一個BFC就行了钻弄，但是對于兩個相鄰元素來說佃却，意義不大，沒有必要給他們加個外殼窘俺，但是對于嵌套元素來說就很有必要了饲帅，只要把父元素設(shè)為BFC就可以了。這樣子元素的margin就不會和父元素的margin發(fā)生重疊瘤泪。
2灶泵、BFC不會重疊浮動元素
3、BFC可以包含浮動(overflow:auto; overflow:hidden对途；副作用比較猩饬凇；
7.在什么場景下會出現(xiàn)外邊距合并实檀？如何合并惶洲？如何不讓相鄰元素外邊距合并？給個父子外邊距合并的范例
答：外邊距合并指的是膳犹，當(dāng)兩個垂直外邊距相遇時恬吕，它們將形成一個外邊距。合并后的外邊距的高度等于兩個發(fā)生合并的外邊距的高度中的較大者须床。
1.當(dāng)一個元素出現(xiàn)在另一個元素上面時币呵，第一個元素的下外邊距與第二個元素的上外邊距會發(fā)生合并。請看下圖：
2.當(dāng)一個元素包含在另一個元素中時（假設(shè)沒有內(nèi)邊距或邊框把外邊距分隔開），它們的上和/或下外邊距也會發(fā)生合并余赢。請看下圖
3.假設(shè)有一個空元素芯义，它有外邊距，但是沒有邊框或填充妻柒。在這種情況下扛拨，上外邊距與下外邊距就碰到了一起，它們會發(fā)生合并.
(注釋：只有普通文檔流中塊框的垂直外邊距才會發(fā)生外邊距合并举塔。行內(nèi)框绑警、浮動框或絕對定位之間的外邊距不會合并。)
形成BFC 可以阻止外邊柜合并央渣，對于垂直相鄰的元素可以設(shè)置浮動或設(shè)置其中一個元素為display:inline-block;對于父子元素外邊距计盒，可為父元素設(shè)置padding或border。
