• 問題一：外邊距合并問題

問題描述：外邊距合并指的是，當兩個垂直外邊距相遇時，它們將形成一個外邊距。合并后的外邊距的高度等于兩個發(fā)生合并的外邊距的高度中的較大者;

解決方法：
1、使用這種特性
2、設置一邊的外邊距，一般設置margin-top
3、將元素浮動或者定位

• 問題二：margin-top 塌陷問題

問題描述：在兩個盒子嵌套時候，內(nèi)部的盒子設置的margin-top會加到外邊的盒子上，導致內(nèi)部的盒子margin-top設置失??；

解決方法：
1、外部盒子設置一個邊框
2、外部盒子設置 overflow:hidden
3、使用偽元素類：

此代碼就是用偽元素類方式解決的；
.clearfix:before{
    content: '';
    display:table;
}

• 問題三：css元素溢出問題

問題描述: 當子元素的尺寸超過父元素的尺寸時出現(xiàn)此問題；

解決方法：
需要通過overflow來設置父元素顯示溢出的子元素的方式；

overflow的設置項： 
1、visible 默認值。內(nèi)容不會被修剪，會呈現(xiàn)在元素框之外。
2、hidden 內(nèi)容會被修剪，并且其余內(nèi)容是不可見的，此屬性還有    清除浮動、清除margin-top塌陷的功能。
3、scroll 內(nèi)容會被修剪，但是瀏覽器會顯示滾動條以便查看其余  的內(nèi)容。
4、auto 如果內(nèi)容被修剪，則瀏覽器會顯示滾動條以便查看其余的內(nèi)容。
5、inherit 規(guī)定應該從父元素繼承 overflow 屬性的值。

• 問題四：內(nèi)聯(lián)元素間隙問題

解決內(nèi)聯(lián)元素間隙的方法 :
1、去掉內(nèi)聯(lián)元素之間的換行
2、將內(nèi)聯(lián)元素的父級設置font-size為0，內(nèi)聯(lián)元素自身再設置font-size

*問題五：浮動問題

問題描述：父元素如果沒有設置尺寸(一般是高度不設置)，父元素內(nèi)整體浮動的元素無法撐開父元素，父元素需要清除浮動；

解決清除浮動的方法：
1、父級上增加屬性overflow：hidden
2、在最后一個子元素的后面加一個空的div，給它樣式屬性 clear:both（不推薦）
3、使用成熟的清浮動樣式類，clearfix

.clearfix:after,.clearfix:before{ content: "";display: table;}
.clearfix:after{ clear:both;}
.clearfix{zoom:1;}
或
.con2{... overflow:hidden}
或
<div class="con2 clearfix">