zoukankan      html  css  js  c++  java
  • HTML: margin重疊現象的說明

    2句話:

    ①相鄰的兩個普通元素,上下邊距,不是簡單的相加,而是取邊距較大的元素(若相邻的两个普通兄弟元素,它们的margin 值是一样的,则各取两个元素的margin 值的一半.)
    ②关系为父子的两个div元素,竖直方向上如果两个元素都设有margin值,则会取margin值较大的元素的边距值,且只設置父元素的這個方向的邊距值。

    例①

    
    

    .dv1{
      height:100px;
      background-color:red;
      margin-bottom: 50px;
    }
    .dv2{
      margin-top: 100px;//取較大的
      background-color: green;
      height:100px;
    }

    <div class="dv1">DV1</div>

    <div class="dv2">DV2</div>

    例②

      #dv3 {
        height:100px;
        margin-top: 10px;
        background-color: blue;
      }
      #dv4 {
        margin-top:0px;
        height:50px;
        background-color: black;
      }

    <div id="dv3">
        <div id="dv4">
            我是dv4
        </div>
    </div>
    

    直觀的看法就是自己動手測試!

  • 相关阅读:
    <trim>: prefix+prefixOverrides+suffix+suffixOverrides
    时间js
    form表单中name和id区别
    SQL 递归
    表单中Readonly和Disabled的区别
    jquery select取值,赋值操作
    ie11
    mongodb 学习资料
    H5 限制input只能输入数字
    http头部解释
  • 原文地址:https://www.cnblogs.com/Zell-Dinch/p/4267016.html
Copyright © 2011-2022 走看看