Skip to main content

order 属性

Docs

order - CSS：层叠样式表 | MDN (mozilla.org)

order 决定了 flex items 的排布顺序

  • 可以设置任意整数（正整数、负整数、0），值越小就越排在前面
  • 默认值是 0

order 属性用于在弹性容器内对 flex item 进行排序，可以控制 flex item 的布局顺序。

order 属性是一个整数值，默认为 0。值越小的 flex item 越先出现在容器内，值相同时按照它们在 HTML 代码中的顺序出现。

除了用数字值指定 order 属性，还可以使用负数值和小数值。负数值将使 flex item 在默认顺序之前出现，小数值将使 flex item 在默认顺序之后出现。

需要注意的是，order 属性不会改变 flex item 在文档流中的位置，只会改变它们在弹性容器内的布局顺序。如果需要改变 flex item 在文档流中的位置，可以使用 CSS 的 position 属性或者 flexbox 的其他属性来实现。

Details