浮動(dòng)元素有什么特征？對(duì)父容器、其他浮動(dòng)元素、普通元素、文字分別有什么影響?
浮動(dòng)元素脫離了普通文檔流，文檔的普通流中的元素表現(xiàn)的就像浮動(dòng)元素不存在一樣。
浮動(dòng)的框可以向左向右移動(dòng)，直到它的外邊緣碰到包含框或者另一個(gè)浮動(dòng)的邊緣為止。
對(duì)父容器的影響：如果父容器的子元素都是浮動(dòng)元素，那么父容器失去高度。
對(duì)其他浮動(dòng)元素的影響：如果水平空間不夠會(huì)將浮動(dòng)元素排到下一行，如果上一行的元素大小不一，被排到下一行的元素可能會(huì)被卡住。
對(duì)普通元素的影響：因?yàn)槠胀ㄔ孛撾x了文檔流，普通文檔流中的元素表現(xiàn)得就像浮動(dòng)元素不存在一樣。
對(duì)文字的影響：文字會(huì)感應(yīng)到浮動(dòng)元素的存在并產(chǎn)生文字浮動(dòng)效果。
清除浮動(dòng)指什么? 如何清除浮動(dòng)? 兩種以上方法
清楚浮動(dòng)指的是元素浮動(dòng)后由于浮動(dòng)元素的特性會(huì)使其他元素的布局方式受到影響，此時(shí)我們清除浮動(dòng)就是使用一些方法消除浮動(dòng)元素對(duì)其他元素排版布局的影響。
** 方法 **
在父容器最后添加一個(gè)空div，并清理這個(gè)div。clear：both；
-
使父容器生成一個(gè)BFC，因?yàn)锽FC可以包含浮動(dòng)。
規(guī)定滿足下列CSS聲明之一的元素便會(huì)生成BFC。
根元素- float的值不為none
- overflow的值不為visible
- display的值為inline-block、table-cell、table-caption
- position的值為absolute或fixed
/*方法1*/
.clearfix{
*zoom:1;
}
.clearfix:after{
content:"";
display:block;
clear:left;
}
/*方法2*/
.clearfix{
*zoom:1;
}
.clearfix:after{
content:"";
display:table;
clear:both;
}?
有幾種定位方式，分別是如何實(shí)現(xiàn)定位的，參考點(diǎn)是什么，使用場(chǎng)景是什么？
| 定位方式 | 實(shí)現(xiàn)方法 | 參考點(diǎn) | 使用場(chǎng)景 |
|---|---|---|---|
| static | 默認(rèn)值，元素在普通文檔流中 | 無 | |
| relative | 相對(duì)定位，元素框偏移某個(gè)距離。保留它原來所在位置 | 元素本身 | 元素偏移 |
| absolute | 絕對(duì)定位,元素框從文檔流中分離出來，元素定位后生成一個(gè)塊級(jí)框，不論原來它在文檔流中生成何種類型的框 | 距離最近的非static元素，沒有則為body | 元素垂直居中 |
| fixed | 固定定位，生產(chǎn)絕對(duì)定位元素，但不隨著滾動(dòng)條的移動(dòng)而改變位置 | 瀏覽器窗口 | 登錄框覆蓋層 |
z-index 有什么作用? 如何使用?
z-index 屬性設(shè)置元素的堆疊順序。擁有更高堆疊順序的元素總是會(huì)處于堆疊順序較低的元素的前面。如果為正數(shù)，則離用戶更近，為負(fù)數(shù)則表示離用戶更遠(yuǎn)。z-index 僅能在定位元素上奏效。
position:relative和負(fù)margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別
二者都可以讓元素發(fā)生偏移，相對(duì)定位讓元素顯示的位置發(fā)生，但會(huì)保留原來元素所在的位置，負(fù)margin會(huì)改變?cè)卦谖臋n流中的位置。
BFC 是什么？如何生成 BFC？BFC 有什么作用？舉例說明
BFC的全稱是 Block Format Content，塊級(jí)格式化上下文。 規(guī)定滿足下列CSS聲明之一的元素便會(huì)生成BFC。
- 根元素
- float的值不為none
- overflow的值不為visible
- display的值為inline-block、table-cell、table-caption
- position的值為absolute或fixed
** 作用 **
BFC會(huì)阻止垂直外邊距（
margin-top,margin-bottom）折疊
按照BFC定義，只有同屬于一個(gè)BFC時(shí)，兩個(gè)元素才有可能發(fā)生垂直margin的重疊，這個(gè)包括相鄰元素，嵌套元素，只要他們之間沒有阻擋（例如邊框,非空白內(nèi)容，padding等）就會(huì)發(fā)生margin重疊。
因此只要解決margin重疊問題只要讓兩個(gè)元素不在同一個(gè)BFC就行了，但是對(duì)于兩個(gè)相鄰元素來說，意義不大，沒有必要給它們加個(gè)外殼，但是對(duì)于嵌套元素來說很有必要，只要報(bào)父元素設(shè)置為BFC就可以了，這樣子元素的margin就不會(huì)和父元素的margin發(fā)生重疊了。BFC不會(huì)重疊浮動(dòng)元素。
BFC可以包含浮動(dòng)元素。
在什么場(chǎng)景下會(huì)出現(xiàn)外邊距合并？如何合并？如何不讓相鄰元素外邊距合并？給個(gè)父子外邊距合并的范例
外邊距合并指的是，當(dāng)兩個(gè)垂直外邊距相遇時(shí)，它們將形成一個(gè)外邊距。
合并后的外邊距的高度等于兩個(gè)發(fā)生合并的外邊距的高度中的較大者。
相鄰元素合并外邊框
父子元素合并外框
空元素外邊距合并
多個(gè)空元素外邊距合并
