阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      CSS3 box-ordinal-group

      CSS3 box-ordinal-group

      指定的一个box的子元素的显示顺序:

      .box
      {
          display:-ms-flexbox; /* Internet Explorer 10 */
          display:-moz-box; /* Firefox */
          display:-webkit-box; /* Safari and Chrome */
          display:box;
          border:1px solid black;
      }
      .ord1
      {
          margin:5px;
          -ms-flex-order:1; /* Internet Explorer 10 */
          -moz-box-ordinal-group:1; /* Firefox */
          -webkit-box-ordinal-group:1; /* Safari and Chrome */
          box-ordinal-group:1;
      }
      .ord2
      {
          margin:5px;
          -ms-flex-order:2; /* Internet Explorer 10 */
          -moz-box-ordinal-group:2; /* Firefox */
          -webkit-box-ordinal-group:2; /* Safari and Chrome */
          box-ordinal-group:2;
      }
      

      浏览器支持

      目前主流浏览器都不支持box-ordinal-group属性。

      Internet Explorer 10 通过私有属性 ms-flex-order 支持.

      Firefox 通过私有属性 -moz-box-ordinal-group 支持.

      Safari和Chrome通过私有属性, -webkit-box-ordinal-group支持.

      **注意:**Internet Explorer 9及更早IE版本不支持弹性框.


      属性定义及使用说明

      box-ordinal-group 属性指定一个box的子元素的显示顺序。

      具有较低值的元素显示在那些具有较高的值的元素之前。

      注意: 同一组值的元素显示顺序取决于他们源顺序。

      默认值:1
      继承:no
      版本:CSS3
      JavaScript 语法:object.style.boxOrdinalGroup=2

      语法

      box-ordinal-group: integer;
      
      描述
      integer一个整数,指示子元素的显示顺序
      目录
      目录