CSS浮動與定位
1. 浮動元素有什么特征锋八？對父容器、其他浮動元素护盈、普通元素挟纱、文字分別有什么影響?
特征：
- 浮動元素使元素脫離文檔流，按照指定方向發(fā)生移動腐宋，遇到父級元素邊界或其他浮動元素停下
對父元素的影響
如果一個父元素的子元素都是浮動元素紊服，并且父元素本身沒有設(shè)置寬高，則會導(dǎo)致父元素塌陷胸竞。
對其他浮動元素的影響
所有的浮動元素會水平排列知道直到遇到父級邊界欺嗤，如果寬度不夠就換行向下排列，此時如果第一個的高度高于第二個就會導(dǎo)致被浮動元素擋住的情況
對普通元素的影響
普通元素會認為浮動元素是不存在的卫枝，所以普通元素不會發(fā)生變化煎饼，而浮動元素會浮在普通元素上面將其覆蓋
對文字的影響
普通的元素認為浮動元素是不存在的，但是文字認為它是存在的校赤，所以文字會環(huán)繞浮動元素吆玖，如下圖綠色的div被覆蓋了筒溃，但是它的文字內(nèi)容卻在紅色的浮動的div外面。
2. 清除浮動指什么? 如何清除浮動? 兩種以上方法
- 使用clear樣式沾乘，clear： left | right | both;
- 利用BFC來清除浮動怜奖。
因為BFC可以包含浮動，因此可以讓父元素生成一個新的BFC從而包圍浮動的子元素翅阵。因此給父容器設(shè)置BFC,就可以解決父容器在子元素都為浮動時的塌陷問題歪玲，因此可以清除浮動。
3. 有幾種定位方式掷匠，分別是如何實現(xiàn)定位的滥崩，參考點是什么，使用場景是什么槐雾？
（1）靜態(tài)定位：position:static
默認參數(shù)夭委，默認布局方式幅狮；
（2）相對定位：position: relative
相對自己默認位置定位募强；一般作為絕對定位的元素參考點，或者頁面圖片的小偏移崇摄。
使用場景：在自身基礎(chǔ)上調(diào)整位置擎值；
（3）絕對定位：position: absolute
絕對定位元素脫離正常文檔流，相對其設(shè)置了position為static以外的參數(shù)的父元素逐抑，若沒有鸠儿，就相對于頁面左上角；
使用場景：部分賬戶頭像紅點提示角標厕氨、元素的水平垂直居中进每。
（4）固定定位：position: fixed
相對瀏覽器窗口進行定位。因此當滾動產(chǎn)生時命斧，固定定位元素依然處于窗口的某個固定位置田晚。
使用場景：網(wǎng)站“返回頂部”按鈕，小廣告国葬。
（5）粘性定位：position: sticky
是相對定位和固定定位的結(jié)合贤徒。默認情況下表現(xiàn)為相對定位，當瀏覽器窗口頂端與元素的距離等于 top 屬性的值時汇四，轉(zhuǎn)變?yōu)楣潭ǘㄎ弧?br>
使用場景：產(chǎn)品類網(wǎng)站購物導(dǎo)航條/介紹導(dǎo)航條接奈。
4. z-index 有什么作用? 如何使用?
z-index 屬性設(shè)置元素在Z軸方向上的堆疊順序。數(shù)值越大通孽，元素越靠前序宦。可設(shè)置負的 z-index 屬性值背苦。Z-index 僅能在定位元素（position:relative/absolute/fixed）上奏效互捌。
5. position:relative和負margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別
position:relative;只相對自己原本位置發(fā)生偏移堡僻，不影響其它普通流中元素的位置。
margin：除了讓元素自身發(fā)生偏移還影響其它普通流中的元素疫剃。
6. BFC 是什么钉疫？如何生成 BFC？BFC 有什么作用巢价？舉例說明
BFC是塊級格式上下文牲阁。其解釋是：浮動、絕對定位（絕對定位壤躲、固定定位）元素城菊、塊級容器（如inline-block、 table-cell碉克、table-caption）并不是塊級盒子凌唬，還包括那些overflow屬性值取值visible以外的塊級盒子，會為它們的內(nèi)容物創(chuàng)建一個新的塊級格式化上下文漏麦。對元素設(shè)置以下屬性就可以生成BFC：
float: left | right;
overflow: hidden | auto | scroll;
display: table-cell | table-caption | inline-block;
position: absolute | fixed;
BFC的作用有：
（1）解決margin重疊問題客税。所謂margin重疊是指處于同一個BFC的相鄰元素、嵌套元素撕贞，只要它們之間沒有阻擋（如：邊框更耻、非空內(nèi)容、padding等）就會發(fā)生margin重疊捏膨。這是只要讓其中一個元素生成新的BFC就能解決margin重疊問題秧均。
（2）清除浮動。因為BFC可以包含浮動号涯，所以讓父容器生成新的BFC可以讓父容器在視覺上包圍了浮動的子元素目胡，因而清除了浮動。
7. 在什么場景下會出現(xiàn)外邊距合并链快？如何合并誉己？如何不讓相鄰元素外邊距合并？給個父子外邊距合并的范例
在同一個BFC中相鄰元素的上下外邊距會合并久又，合并時巫延，取較大值為外邊距
修復(fù)
