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

      flex-direction

      語法:

      flex-direction:row | row-reverse | column | column-reverse

      默認(rèn)值row

      適用于:flex容器

      繼承性:無

      動(dòng)畫性:否

      計(jì)算值:指定值

      取值:

      row:
      主軸與行內(nèi)軸方向作為默認(rèn)的書寫模式。即橫向從左到右排列(左對(duì)齊)。
      row-reverse:
      對(duì)齊方式與row相反。
      column:
      主軸與塊軸方向作為默認(rèn)的書寫模式。即縱向從上往下排列(頂對(duì)齊)。
      column-reverse:
      對(duì)齊方式與column相反。

      說明:

      該屬性通過定義flex容器的主軸方向來決定felx子項(xiàng)在flex容器中的位置。這將決定flex需要如何進(jìn)行排列
      • 該屬性的反轉(zhuǎn)取值不影響元素的繪制,語音和導(dǎo)航順序,只改變流動(dòng)方向。這與 <' writing-mode '> 和 <' direction '> 相同。
      • 示例:將一個(gè)容器內(nèi)的子元素反轉(zhuǎn)橫向排列

        Code:

        <ul id="flex"> <li>a</li> <li>b</li> <li>c</li> </ul> #box { display: flex; flex-direction: row-reverse; list-style: none; }

        請(qǐng)自行根據(jù)需要補(bǔ)全廠商前綴。flex生效需定義 <' display '> 為flex或inline-flex(box或inline-box,這是舊的方式)

      • 對(duì)應(yīng)的腳本特性為flexDirection

      兼容性:

      • 淺綠 = 支持
      • 紅色 = 不支持
      • 粉色 = 部分支持
      Values IE Firefox Chrome Safari Opera iOS Safari Android Browser Android Chrome
      Basic Support 6.0-10.0 2.0-21.0 4.0-20.0 6.0 15.0+-webkit- 6.0-6.1 2.1-4.3 18.0-19.0
      11.0+ 22.0+ 21.0+-webkit- 6.1+-webkit- 17.0+ 7.0+-webkit- 4.4+ 20.0+-webkit-
      29.0+ 9.0+ 9.0+ 28.0+

      示例:

      本頁最后更新時(shí)間:

      2015.7.29

      1. <span id="z4nqb"></span>
        超碰在线进入 | 午夜一区二区三区免费视频 | 婷婷色一区二区三区 | AAA免费视频 | 青青草成人视频在线播放 | 国产xxxxx | 五月婷丁香无码 | 免费的黄色小视频 | 在线黄免费 | 最新国产亚洲免费在线视频 |