1. 浮動(dòng)元素有什么特征？對(duì)父容器、其他浮動(dòng)元素、普通元素、文字分別有什么影響?
   當(dāng)一個(gè)元素浮動(dòng)之后，它會(huì)被移出正常的文檔流，然后向左或者向右平移，一直平移直到碰到了所處的容器的邊框，或者碰到另外一個(gè)浮動(dòng)的元素。
   如果父元素原來的沒有加浮動(dòng)屬性的元素?fù)伍_的，那么當(dāng)元素加浮動(dòng)屬性后，父元素的高度為0.
   普通文檔流中的元素不會(huì)讓位置給浮動(dòng)的元素，這時(shí)可能會(huì)發(fā)生普通文檔流中的元素被浮動(dòng)的元素覆蓋的情況，
   文字會(huì)圍繞這浮動(dòng)元素，不和浮動(dòng)的元素?fù)尩乇P。
   如果很多個(gè)元素都設(shè)置向左浮動(dòng)，他們會(huì)排成一列，直到排滿一行無法在排列之后，會(huì)換行排列。

2. 清除浮動(dòng)指什么? 如何清除浮動(dòng)? 兩種以上方法
   當(dāng)給元素加上浮動(dòng)屬性后，他可能會(huì)覆蓋其他的元素，或者和其他沒有加浮動(dòng)屬性的元素在同一行，如果我們不想讓添加了浮動(dòng)屬性的元素影響到其他元素時(shí)，就應(yīng)該使用清除浮動(dòng)來消除他(浮動(dòng)的元素)對(duì)其他元素的影響。
   第一種方法：給浮動(dòng)元素的周圍添加clear:left或者clear:right屬性,注意此種方法消除的是左邊有向左浮動(dòng)的元素或者右邊有向右浮動(dòng)的元素。
   第二種方法：使用BFC方式消除浮動(dòng)，給浮動(dòng)元素周圍的其他元素再嵌套一層div，并設(shè)置新增加的div的overflow屬性為hidden。(其他能夠觸發(fā)BFC的屬性皆可)。

3. 有幾種定位方式，分別是如何實(shí)現(xiàn)定位的，參考點(diǎn)是什么，使用場景是什么？
   inherit繼承：繼承父元素的position屬性
   static無定位：沒有定位，元素出現(xiàn)在普通文檔流中，設(shè)置top, right, bottom, left不起任何作用。
   absolute絕對(duì)定位：生成絕對(duì)定位的元素，相對(duì)于第一個(gè)position的值不是static的父元素定位
   relative相對(duì)定位：生成相對(duì)定位的元素，相對(duì)于自己正常應(yīng)該所處的位置進(jìn)行定位
   fixd固定定位：固定在瀏覽器的窗口中，不會(huì)隨著窗口的滾動(dòng)和產(chǎn)生位置變化，相對(duì)用瀏覽器窗口進(jìn)行定位。
   sticky混合定位：當(dāng)元素本身的位置應(yīng)該在窗口時(shí)，采取相對(duì)定位。當(dāng)元素在窗口中不可見時(shí)，采取固定定位。

4. z-index 有什么作用? 如何使用?
   控制元素層疊順序，z-index解決重疊時(shí)的顯示次序問題
   所有的層都可以用一個(gè)整數(shù)(z軸順序)來表明當(dāng)前層在z軸的位置。 數(shù)字越大， 元素越接近觀察者。Z軸順序用CSS的[z-index]屬性來指定。
   使用方法：
   先設(shè)置元素的定位不是static（繼承父元素也可以，但是不能為static），再設(shè)置z-index的值。老師說并不是z-index的值越大就一定能顯示到最前面，我查閱了一些文章發(fā)現(xiàn)，這種情況跟父元素的z-index的值也相關(guān)，如果是同級(jí)的元素，z-index的值越大顯示的越靠近用戶。

5. position:relative和負(fù)margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別
   position:relative是讓元素自己的位置發(fā)生了變化，脫離了普通文檔流，可以遮擋其他元素。
   負(fù)margin沒有使元素脫離普通文檔流，不會(huì)遮擋其他元素的正常顯示。

6. BFC 是什么？如何生成 BFC？BFC 有什么作用？舉例說明
   塊級(jí)格式化上下文，是一塊頁面上獨(dú)立的區(qū)域(容器)，可以是一個(gè)block，可以一個(gè)inline-block元素，或者是一個(gè)具有浮動(dòng)屬性或者絕對(duì)定位(絕對(duì)定位，固定定位)的元素，overflow屬性不是visiable的元素。

如果想創(chuàng)建BFC，有以下幾個(gè)方法：

float 除了none以外的值
overflow 除了visible 以外的值（hidden，auto，scroll ）
display (table-cell，table-caption，inline-block, flex, inline-flex)
position值為（absolute，fixed）
這幾種方法都會(huì)引發(fā)一些我們不愿意見到的事情，具體的使用針對(duì)不同的情況而定。

BFC的作用：

1.阻止垂直外邊距折疊
2.不會(huì)重疊浮動(dòng)元素
3.可以包含浮動(dòng)
4.清除浮動(dòng)
舉例說明作用1:阻止垂直外邊距折疊
創(chuàng)建了三個(gè)div塊并且給他們設(shè)置了margin: 20px的屬性，但是發(fā)現(xiàn)上下的間距重合了，這是我們要給他們設(shè)置不同的BFC就可以消除垂直外邊距折疊。

一般情況

創(chuàng)建不同BFC之后

7. 在什么場景下會(huì)出現(xiàn)外邊距合并？如何合并？如何不讓相鄰元素外邊距合并？給個(gè)父子外邊距合并的范例
   會(huì)出現(xiàn)外邊距合并的場景：
   1.同一個(gè)BFC中的處于普通文檔流中的垂直相鄰元素外邊距會(huì)合并。
   2.塊級(jí)父元素和他的第一個(gè)、最后一個(gè)子元素
   3.空的塊級(jí)元素。
   外邊距合并規(guī)則：
   1.當(dāng)兩邊的margin都是正數(shù)時(shí)，取兩者中較大的值；
   2.當(dāng)兩邊的margin值都是負(fù)數(shù)時(shí)，取其中絕對(duì)值較大的負(fù)向位移；
   3.當(dāng)兩邊的margin值有正有負(fù)的時(shí)候，先取絕對(duì)值較大的負(fù)值，然后和正的值最大的相加。
   4.所有相鄰的元素要一起參與運(yùn)算，不能分步進(jìn)行。
   不讓相鄰元素外邊距合并的方法：為他們各自創(chuàng)建一個(gè)BFC，使他們不在一個(gè)BFC中。
   HTML代碼：

 <div class="ct">
    <div class=box>
        <h5>111</h5>
    </div>
    <div class=box>
        <h5>222</h5>
    </div>
</div>

CSS代碼：

.ct {
    width: 600px;
    height: 600px;
    border: 1px solid;
}
.box {
    background-color: #0f0;
    /* overflow: hidden;   */
    margin: 100px;
}
h5 {
    background-color: #00f;
    margin: 100px;            
}

按照我們的設(shè)想，h5用100px的外邊距，.box也有100px的外邊距，上方和下方應(yīng)該都是100px，而中間應(yīng)該有200px的外邊距才是。

這時(shí)我們可以看到，上中下的邊距是一致的，這是因?yàn)樽釉豩5和父元素div之間發(fā)生了父子外邊距合并