1，外側距的合併現象：
如果兩個p上下排序，給上面一個p設定margin-bottom，給下面一個p設定margin-top ，那麼兩個margin會發生合併現象，合併以後的值較大的那個。
對於這種現像一般不用處理。
2，margin塌陷現象：
如果一個大盒子中包含一個小盒子給小盒子設定margin-top大盒子會一起向下平移。
解決方案：
1.0為大盒子加上一個邊框border屬性。
2.0給大盒子設定一個overflow屬性。
3.0使用浮動。
補充：overflow的常用屬性如下：
visible |
:預設值.內容不會被修剪，會呈現在元素框外。 |
Hidden#： |
內容會被修剪，其餘內容是不可見的。 |
Scroll#： |
內容會被修剪，但是瀏覽器會顯示捲軸以便查看其餘的內容。 |
Auto#： |
如果內容被修剪，則瀏覽器會顯示捲軸以便查看其餘的內容。 |
浮動
浮動是css中的一個重點，為什麼要使用浮動？
是為了解決一行中顯示多個盒子的問題。
浮動有三個特點：
1，脫離標準流，不佔位置。
2，會改變元素的預設顯示方式display為block區塊級元素。
3， 浮動的元素只會覆寫後邊的區塊級元素，不影響前邊的區塊級元素。
什麼是標準流？
就是瀏覽器預設擺放盒子的標準。
標準流的特性：
1，塊級元素從上到下，獨佔一行。
2，行內元素，行內區塊級元素從左到右在一行中顯示。
3，佔位置。
浮動的影響以及清除浮動的三種辦法
#浮動對頁面的影響：
如果一個父盒子中有一個子盒子，並且父盒子沒有設置高，子盒子在父盒子中進行了浮動，那麼將來父盒子的高度為0。由於父盒子的高度為0，下面的元素會自動補位，所以這個時候要進行浮動的清除。
Clear：both
1，使用額外標籤法：
在浮動的盒子底下再放一個標籤，在這個標籤中使用clear:both，來清除浮動對頁面的影響。
.clearfix{
clear: both;
/p>
a.內部標籤：會將這個浮動盒子的父盒子高度重新撐開
b.外部標籤：會將這個浮動盒子的影響清除，但是不會撐開父盒。
注意：一般情況下不會使用這一種方式來清除浮動。因為這種清除浮動的方式會增加頁面的標籤。
2，使用overflow屬性來清除浮動：
先找到浮動盒子的父元素，再在父元素中加入一個屬性，就是清除這個父元素中的子元素浮動對頁面的影響。
overflow: hidden;
3，使用偽元素來清除浮動：
.clearfix
:after{
line-height: 0;//內容文字的高度為0
display: block;//將文字設定為oth;//清除浮動
visibility: hidden;///將元素隱藏 ## zoom: 1;/*為了相容於ie6*/
}
#visible| 1 | |
:預設值.內容不會被修剪，會呈現在元素框外。 |
Hidden | #：
內容會被修剪，並且其餘內容是不可見的。 |
|
Scroll#： |
內容會被修剪，但是瀏覽器會顯示捲軸以便查看其餘的內容。 |
Auto#： |
如果內容被修剪，則瀏覽器會顯示捲軸以便查看其餘的內容。 |
以上是詳解css中的浮動與三種清除浮動的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！
