網頁標準文檔流中垂直方向的margin塌陷現象

simon_chen 發布于2019-08-02 14:01 / 813人閱讀

摘要：在標準文檔流中即沒有浮動，如果設置了浮動那就不會出現這中情況了，中有兩個元素，這兩個元素的寬高都是，第一個設置了第二個設置了，那么實際上兩個元素之間的距離是，這就是塌陷現象，并且塌陷還是以大的一方為準。

在標準文檔流中（即沒有浮動，如果設置了浮動那就不會出現這中情況了），body中有兩個div元素，這兩個div元素的寬、高都是200px，第一個div設置了margin-bottom:t0px;第二個div設置了margin-top:20px，那么實際上兩個div元素之間的距離是50px，這就是margin塌陷現象，并且margin塌陷還是以大的一方為準。如圖片：




    
        margin-bottom: 50px;
    
    
        margin-top: 20px;

GPU云服務器云服務器云服務器網絡帶寬受限的現象 C 從 UTF-8 流中讀取字符串的正確標準網頁 margin:

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/53518.html

網頁標準文檔流中垂直方向的margin塌陷現象

摘要：在標準文檔流中即沒有浮動，如果設置了浮動那就不會出現這中情況了，中有兩個元素，這兩個元素的寬高都是，第一個設置了第二個設置了，那么實際上兩個元素之間的距離是，這就是塌陷現象，并且塌陷還是以大的一方為準。在標準文檔流中（即沒有浮動，如果設置了浮動那就不會出現這中情況了），body中有兩個div元素，這兩個div元素的寬、高都是200px，第一個div設置了margin-bottom:t...

flybywind 2019-08-30 15:55 評論0 收藏0
CSS知識點及技巧整理

摘要：當元素在容器中被滾動超過指定的偏移值時，元素在容器內固定在指定位置。詳見浮動與清除浮動浮動相關知識屬性的取值元素向左浮動。是相對長度單位，相對于當前對象內文本的字體尺寸。這些個知識點是我個人認為的，下面我們就來看看這些個知識點。 1.怎么讓一個不定寬高的 DIV，垂直水平居中? 使用Flex 只需要在父盒子設置：display: flex; justify-content: cent...

masturbator 2019-08-30 14:02 評論0 收藏0
CSS知識點及技巧整理

摘要：當元素在容器中被滾動超過指定的偏移值時，元素在容器內固定在指定位置。詳見浮動與清除浮動浮動相關知識屬性的取值元素向左浮動。是相對長度單位，相對于當前對象內文本的字體尺寸。這些個知識點是我個人認為的，下面我們就來看看這些個知識點。 1.怎么讓一個不定寬高的 DIV，垂直水平居中? 使用Flex 只需要在父盒子設置：display: flex; justify-content: cent...

EasonTyler 2019-08-01 18:38 評論0 收藏0
web前端（11）—— 頁面布局1

摘要：維護起來更加方便不足雪碧的最大問題是內存使用拼圖維護比較麻煩使的編寫變得困難雪碧調用的圖片不能被打印我們可以使用綜合屬性制作通天，什么是通天呢，就是一般我們電腦的屏幕都是但是設計師給我們的圖都會比這個大，那么我們可以此屬性來制作通天。要說頁面布局的話，那就必須說說margin，padding，和background。這三個屬性其實都是前面講過的，這里還是再次講解以下，為什么呢？因為是這樣的...

番茄西紅柿 2019-04-23 13:11 評論0 收藏0