1鸥滨、浮動元素有什么特征戴甩？對父容器符喝、其他浮動元素、普通元素甜孤、文字分別有什么影響?
特征：浮動元素會脫離文檔流协饲，會隨著設(shè)置的float屬性值的設(shè)定向左或向右移動，直到她的邊緣觸碰到父元素或者同為浮動元素的邊緣课蔬，普通文檔流會忽視浮動元素的存在囱稽。
a)對于父元素來說，假如子元素都是浮動的二跋，則父元素高度塌陷
b)對于其他浮動元素來說战惊，浮動元素遇到其他浮動元素時會停止繼續(xù)移動，如果父元素的寬度不夠扎即，則浮動元素會換行吞获，假如存在三個浮動元素，前兩個并排浮動谚鄙，父元素寬度不夠的話各拷，第三個會換到下一行，假如第一個浮動元素很大闷营，那么第三個就會被第一個浮動元素卡住烤黍，不會重新起一行，而是在第二個的下面靠著第一個傻盟，呈現(xiàn)一種被卡住的 狀態(tài)
c)對于普通元素速蕊，會忽視浮動元素的存在，假如有三個元素娘赴，第二個浮動规哲，則第二個元素會覆蓋第一個，第三個會占據(jù)原來第二個元素的位置
d)對于文字诽表，文字內(nèi)容會感受到浮動元素的存在唉锌，即文字不會浮動隅肥，會呈現(xiàn)一種文字環(huán)繞的效果
2、清除浮動指什么? 如何清除浮動?
清除浮動：由于浮動會導(dǎo)致父元素的高度塌陷或者樣式變形等袄简，所以要清楚浮動
方法：
1腥放、在浮動元素后面添加一個空標簽，并設(shè)置clear：both屬性
<div style="clear:both"></div>
2痘番、父元素屬性中添加overflow: hidden;
.parent{
overflow: hidden;
}
3捉片、使用偽類代替空白標簽
.parent:after {
content: "";
display: block;
clear: both;
}
3平痰、有幾種定位方式汞舱，分別是如何實現(xiàn)定位的，參考點是什么宗雇，使用場景是什么昂芜？
定位方式：position的定位方式可以分為兩種，相對定位以及絕對定位赔蒲，其取值有static泌神、relative、absolute舞虱、fixed欢际、sticky
a)static：默認值，根據(jù)正常的文檔流定位
b)relative：根據(jù)正常的文檔流定位矾兜，相對于本身的位置進行偏離损趋，不影響其他元素, 本身在頁面布局中的位置仍然存在，形成了重疊上下文, z-index有效
c)absolute：不在正常的文檔流中椅寺，在頁面布局中不占據(jù)位置浑槽，相對于離它最近的設(shè)置了postion 不是static的祖先的定位; 如果不存在這樣的祖先, 就是相對于<body>的定位.
d)fixed：不在正常的文檔流中，在頁面布局中不占據(jù)位置相對于視窗來定位返帕，視窗滾動時, 位置并不會移動桐玻，可以用來做在滾動條滾動時固定不變的部分（父元素假如存在transform的屬性會出現(xiàn)bug）
e)sticky：粘性定位是相對定位和固定定位的混合。元素在跨越特定閾值前為相對定位荆萤，之后為固定定位镊靴。兼容性較差
參考MDN
4、z-index 有什么作用? 如何使用?
z-index是針對網(wǎng)頁顯示中的一個特殊屬性链韭。因為顯示器是顯示的圖案是一個二維平面偏竟，擁有x軸和y軸來表示位置屬性。為了表示三維立體的概念如顯示元素的上下層的疊加順序引入了z-index屬性來表示z軸的區(qū)別梧油。表示一個元素在疊加順序上的上下立體關(guān)系苫耸。
在一個層疊上下文中, z-index值較大的元素將疊加在z-index值較小的元素之上。對于未指定此屬性的定位對象儡陨，z-index 值為正數(shù)的對象會在其之上褪子，而 z-index 值為負數(shù)的對象在其之下.
5量淌、position:relative和負margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別
a)relative相對自身發(fā)生偏移，但是自身所占的位置還在嫌褪，不會改變周圍元素布局
b)margin為負值時呀枢，自身所占的元素讓出來，影響周圍元素以及布局
6笼痛、BFC 是什么裙秋？如何生成 BFC？BFC 有什么特性缨伊？
BFC：一個獨立的布局環(huán)境摘刑，我們可以理解為一個箱子（實際上是看不見摸不著的），箱子里面物品的擺放是不受外界的影響的刻坊。轉(zhuǎn)換為 BFC的理解則是：BFC中的元素的布局是不受外界的影響（我們往往利用這個特性來消除浮動元素對其非浮動的兄弟元素和其子元素帶來的影響枷恕。）并且在一個 BFC中，塊盒與行盒（行盒由一行中所有的內(nèi)聯(lián)元素所組成）都會垂直的沿著其父元素的邊框排列谭胚。
如何生成：
父元素屬性滿足以下條件：float的值不為none徐块，overflow的值不為visible，display的值為inline-block灾而、table-cell胡控、table-caption，position的值為absolute或fixed
特性：
a)margin會發(fā)生合并旁趟，同一個BFC內(nèi)的相鄰元素會發(fā)生margin合并現(xiàn)象
b)BFC不會重疊浮動元素
c)BFC可以包含浮動
7昼激、在什么場景下會出現(xiàn)外邊距合并？如何合并轻庆？如何不讓相鄰元素外邊距合并癣猾？
在CSS當中，相鄰的兩個盒子（可能是兄弟關(guān)系也可能是祖先關(guān)系）的外邊距可以結(jié)合成一個單獨的外邊距余爆。這種合并外邊距的方式被稱為折疊纷宇，并且因而所結(jié)合成的外邊距稱為折疊外邊距。
折疊的結(jié)果：
a)兩個相鄰的外邊距都是正數(shù)時蛾方，折疊結(jié)果是它們兩者之間較大的值像捶。
b)兩個相鄰的外邊距都是負數(shù)時，折疊結(jié)果是兩者絕對值的較大值桩砰。
c)兩個外邊距一正一負時拓春，折疊結(jié)果是兩者的相加的和。
PS:浮動和絕對定位不與任何元素產(chǎn)生 margin 折疊亚隅，inline-block元素與其兄弟元素硼莽、子元素和父元素的外邊距都不會折疊（包括其父元素和子元素）。
避免：
設(shè)置浮動煮纵，display：inline-block等或使其父元素均形成BFC可防止邊距合并
父子外邊距合并：
假如父元素top-margin 10px懂鸵， 子元素top-margin 30px偏螺，且父元素不存在上邊框、上內(nèi)邊距匆光、內(nèi)聯(lián)元素套像、清除浮動，此時子元素與父元素的外邊距發(fā)生合并终息，導(dǎo)致父元素對外呈現(xiàn)的外邊距為30px
深入理解BFC
