（布局盡量用float魔熏，單個的可以用inline-block）浮動元素有什么特征萍诱？對父容器三圆、其他浮動元素狞换、普通元素避咆、文字分別有什么影響?
- 特征：浮動模型是一種可視化格式模型，浮動的框可以左右移動（根據(jù)float屬性值而定）修噪，直到它的外邊緣碰到包含框或者另一個浮動元素的框的邊緣查库。浮動元素不在文檔的普通流中，文檔的普通流中的元素表現(xiàn)的就像浮動元素不存在一樣.
- 對父元素的影響：浮動元素會離開正常的文檔流黄琼，因此會不能撐開父元素樊销，會造成父元素的坍塌。
- 對其他浮動元素的影響：如果包含塊太窄無法容納水平排列的全部浮動元素脏款，那么其它浮動元素會向下移動围苫，直到有足夠的空間，而如果浮動元素的高度不同撤师，那么向下移動的時候可能會被卡准粮；
- 對普通元素的影響：浮動元素已經(jīng)脫離了文檔流剃盾，普通元素會被浮動元素遮擋腺占。
5.對文字的影響：文字能感知浮動元素的存在，會環(huán)繞浮動元素痒谴。
清除浮動指什么? 如何清除浮動? 兩種以上方法
浮動雖然可以便于頁面布局衰伯，但同時會產(chǎn)生一些問題，也就是我們常說的“副作用”积蔚。而一個元素設(shè)置了浮動（即 float 值為 left, right 或 inherit 并從父元素上繼承 left 或 right 值）的常見缺陷是——影響它的兄弟元素的位置和父元素產(chǎn)生高度塌陷意鲸。
清除浮動的方法：
- 在父元素的子元素最后添加一個空div：<div style="clear: both;"></div>，清除了浮動库倘，撐開了父容器;
- 利用BFC的特性去清除浮動临扮。
- 利用偽類清除浮動
.clearfix:after{
content:"";
display:block;
clear:left;
}
有幾種定位方式，分別是如何實現(xiàn)定位的教翩，參考點是什么杆勇，使用場景是什么？
- inherit：規(guī)定應(yīng)該從父元素繼承 position 屬性的值饱亿。
- static：默認值,沒有定位蚜退，元素出現(xiàn)在正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）。
- relative ：生成相對定位的元素彪笼，相對于元素本身正常位置進行定位钻注。另外，無論元素是否移動配猫，元素在文檔流中占據(jù)原來空間幅恋，只是表現(xiàn)出來的位置會改變。
- absolute：生成絕對定位的元素泵肄，絕對定位的元素的位置是相對于距離最近的非static祖先元素位置決定的捆交。如果元素沒有已定位的祖先元素淑翼，那么他的位置就相對于初始包含塊html來定位。絕對定位使元素的位置與文檔流無關(guān)品追。
- fixed：生成絕對定位的元素玄括，相對于瀏覽器窗口進行定位。
- sticky：很少用肉瓦。
z-index 有什么作用? 如何使用?
z-index主要是設(shè)置元素的層疊順序遭京。給元素設(shè)置z-index屬性時，首先需要在這個元素設(shè)置了position屬性值為relative泞莉，absolute哪雕，fixed之一。擁有更高堆疊順序的元素總是會處于堆疊順序較低的元素的前面戒财；元素可擁有負的 z-index 屬性值热监；Z-index 僅能在定位元素（例如 position:absolute;）上奏效捺弦，可覆蓋頁面上的其他元素饮寞；
position:relative和負margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別
負margin使元素在文檔流中占據(jù)的空間發(fā)生偏移，后面的元素將會填充這部分空間列吼，從而影響后面元素的位置幽崩；
position：relative相對定位，元素原本所占空間仍保留寞钥，不會對后面的元素位置產(chǎn)生影響慌申；
BFC 是什么？如何生成 BFC理郑？BFC 有什么作用蹄溉？舉例說明
- BFC就是block formatting context的縮寫，中文就是“塊級格式化上下文”的意思您炉。
block format content柒爵，塊級格式化上下文。是 W3C CSS 2.1 規(guī)范中的一個概念赚爵，它決定了元素如何對其內(nèi)容進行定位棉胀，以及與其他元素的關(guān)系和相互作用。 在進行盒子元素布局的時候冀膝，BFC提供了一個環(huán)境唁奢，在這個環(huán)境中按照一定規(guī)則進行布局不會影響到其它環(huán)境中的布局。也就是說窝剖，如果一個元素符合了成為BFC的條件麻掸，該元素內(nèi)部元素的布局和定位就和外部元素互不影響(除非內(nèi)部的盒子建立了新的 BFC)，是一個隔離了的獨立容器赐纱。
- 如何生成：
- float: left | right;
- overflow: hidden | auto | scroll;
- display: table-cell | table-caption | inline-block;
- position: absolute | fixed;
3.有什么作用脊奋，舉例：
- 包含浮動元素采郎，解決父元素坍塌問題。
- 避免浮動元素重疊狂魔，制作自適應(yīng)兩欄布局：
使box2成為BFC蒜埋，從而不會發(fā)生重疊。
- 避免垂直外邊距疊加：
在什么場景下會出現(xiàn)外邊距合并最楷？如何合并整份？如何不讓相鄰元素外邊距合并？給個父子外邊距合并的范例
- 合并場景:
- 當(dāng)一個元素出現(xiàn)在另一個元素上面時籽孙，第一個元素的下外邊距與第二個元素的上外邊距會發(fā)生合并烈评。請看下圖：
- 當(dāng)一個元素包含在另一個元素中時（假設(shè)沒有內(nèi)邊距或邊框把外邊距分隔開），它們的上和/或下外邊距也會發(fā)生合并犯建。
-
空元素同時有margin-top/bottom讲冠，沒有邊框或填充，其上下margin會合并适瓦；
2 （新加）如何合并：
- 合并后的外邊距的高度等于兩個發(fā)生合并的外邊距的高度中的較大者竿开，水平方向不存在此現(xiàn)象；
- 如果外邊距有正有負玻熙，那么就選取最大值正值和最小的負值相加否彩，得出的即是兩個兩個邊距合并的值；
- 如果對象的外邊距都是負數(shù)嗦随，那么取最小的負數(shù)作為外邊距列荔；
3 如何不讓相鄰元素外邊距合并。
- 把他們設(shè)置成浮動;
- 給其中任意一個元素套一個BFC的父容器（如overflow: hidden;）枚尼，讓它們處于不同的BFC中贴浙；
4 如何不讓嵌套元素外邊距合并：
- 把父元素設(shè)置為BFC；
- 給父元素添加border或padding署恍；
5 如何不讓空元素外邊距合并：
- 元素內(nèi)加content崎溃；
- 給它設(shè)置padding；
小結(jié)锭汛，其實我們發(fā)現(xiàn)要想阻止外邊距合并笨奠，要么變成BFC元素，要么加點border或內(nèi)容使外邊界不能直接相鄰唤殴，就可以阻止外邊距合并般婆。
5例子
