📜  CSS |订购 Flex 项目

📅  最后修改于: 2021-08-31 06:44:31             🧑  作者: Mango

CSS 的order属性可用于对弹性项目进行排序。它指定了一个弹性项目相对于其他弹性项目的顺序。该元素必须是一个灵活的项目,订单属性才能工作。元素按其顺序值的升序显示。如果两个元素具有相同的顺序值,则它们将根据它们在源代码中的出现来显示。

句法:

order: integer | initial | inherit

属性值:

  • 整数:它表示弹性项目的顺序。弹性项目的默认值为 0。
  • 初始值:将属性设置为其默认值。
  • 继承:表示关联元素取其父元素顺序属性的指定值。

示例 1:



  

    
        CSS | Ordering Flex Items
    
      
    

  

    
        
        
        
        
    
  

输出:

示例 2:



      

    
        CSS | Ordering Flex Items
    
      
    

  

    
        
        
        
        
    
  

输出:

支持的浏览器: Ordering Flex Items 支持的浏览器如下:

  • 谷歌浏览器 29.0、21.0 -webkit-
  • Mozilla Firefox 28.0, 18.0 -moz-
  • 浏览器 11.0
  • Safari 9.0, 6.1 -webkit-
  • 歌剧 17.0