1. <span id="z4nqb"></span>

      margin

      語(yǔ)法:

      margin:[ <length> | <percentage> | auto ]{1,4}

      默認(rèn)值看每個(gè)獨(dú)立屬性

      適用于:所有元素,除非 table | inline-table | table-caption的表格類元素之外

      繼承性:無(wú)

      動(dòng)畫性:是

      計(jì)算值:看每個(gè)獨(dú)立屬性

      相關(guān)屬性margin-top||margin-right||margin-bottom||margin-left

      媒體:視覺

      取值:

      auto:
      水平(默認(rèn))書寫模式下,margin-top/margin-bottom計(jì)算值為0margin-left/margin-right取決于包含塊的剩余可用空間。詳見:margin系列之keyword auto
      <length>
      用長(zhǎng)度值來(lái)定義外補(bǔ)白??梢詾樨?fù)值
      <percentage>
      用百分比來(lái)定義外補(bǔ)白。水平(默認(rèn))書寫模式下,參照其包含塊的width進(jìn)行計(jì)算,其它情況參照height,可以為負(fù)值

      說(shuō)明:

      檢索或設(shè)置對(duì)象四邊的外延邊距。
      • 如果提供全部四個(gè)參數(shù)值,將按上、右、下、左的順序作用于四邊。
      • 如果只提供一個(gè),將用于全部的四邊。
      • 如果提供兩個(gè),第一個(gè)用于上、下,第二個(gè)用于左、右。
      • 如果提供三個(gè),第一個(gè)用于上,第二個(gè)用于左、右,第三個(gè)用于下。
      • 非替代(non-Replaced)行內(nèi)元素可以使用該屬性設(shè)置左、右兩邊的外補(bǔ)丁;若要設(shè)置上、下兩邊的外補(bǔ)丁,必須先使該元素表現(xiàn)為塊級(jí)或行內(nèi)塊級(jí)。
      • 外延邊距始終透明。
      • 某些相鄰的margin會(huì)發(fā)生合并,我們稱之為margin折疊:

        示例:

        h2{margin:10px 0;}
        div{margin:20px 0;}
        ......
        <h2>這是一個(gè)標(biāo)題</h2>
        <div>
        	<h2>這是又一個(gè)標(biāo)題</h2>
        </div>

        本例中,第一個(gè)h2的margin-bottom(10px),div的margin-top(20px),第二個(gè)h2的margin-top(10px)將被合并,它們之間的margin間隙最后是(20px),即取三者之間最大的那個(gè)值。

        如果給上例中的div加上border的話:

        示例:

        h2{margin:10px 0;}
        div{margin:20px 0;border:1px solid #aaa;}
        ......
        <h2>這是一個(gè)標(biāo)題</h2>
        <div>
        	<h2>這是又一個(gè)標(biāo)題</h2>
        </div>

        本例中,第一個(gè)h2的margin-bottom(10px),div的margin-top(20px)將被合并,但第二個(gè)h2的margin-top不與它們合并,因?yàn)樗籦order分隔,不與它們相鄰。

      • margin折疊常規(guī)認(rèn)知:
        • margin折疊只發(fā)生在塊級(jí)元素上;
        • 浮動(dòng)元素的margin不與任何margin發(fā)生折疊;
        • 設(shè)置了屬性overflow且值為非visible的塊級(jí)元素,將不與它的子元素發(fā)生margin折疊;
        • 絕對(duì)定位元素的margin不與任何margin發(fā)生折疊;
        • 根元素的margin不與其它任何margin發(fā)生折疊;
      • 對(duì)應(yīng)的腳本特性為margin。

      兼容性:

      • 淺綠 = 支持
      • 紅色 = 不支持
      • 粉色 = 部分支持
      Values IE Firefox Chrome Safari Opera iOS Safari Android Browser Android Chrome
      Basic Support 8.0+ 40.0+ 40.0+ 8.0+ 40.0+ 8.0+ 4.4+ 28.0+

      示例:

      1. <span id="z4nqb"></span>
        日韩成人18禁 | 美女搞黄18禁 | 人人操人人爽人人摸 | 美女擦逼网站 | 国产搞黄色片网 | 91成人社区无码 | 国内9l 自拍九色啦视频 | 夜间福利视频无码在线 | 狠狠色婷婷 | 91影院男人三级 |