order属性用于控制flex子项的排列顺序，值越小越靠前，默认值为0。示例中order:-1的B最先显示，其次是order:1的C，最后是order:2的A，实现视觉顺序调整而不改变HTML结构，常用于响应式设计中的模块重排。
在 Flex 布局中，order 属性用于控制子元素的排列顺序。默认情况下，flex 子项按照它们在 HTML 中出现的顺序显示，但通过设置 order 属性，可以灵活调整它们在容器中的位置。
order 属性的基本规则
order 属性接受一个整数值（正数、负数或零），值越小，元素越靠前。所有子项的默认 order 值为 0，因此只有显式设置了不同 order 值的元素才会改变顺序。
• 元素按 order 值从小到大排序• 相同 order 值的元素保持原有文档顺序
• 不需要连续编号，可用 -1, 0, 1, 100 等任意整数
使用示例
假设有一个 flex 容器和三个子元素：
ABC
最终显示顺序是：B（-1）→ C（1）→ A（2）。
立即学习“前端免费学习笔记（深入）”；
实际应用场景
这个属性特别适合在响应式设计中调整内容顺序，比如在移动端将导航移到内容前面，或把页脚信息提前展示。
• 移动端优先布局中重新组织模块顺序• 无需改动 HTML 结构即可实现视觉顺序变化
• 配合媒体查询动态调整不同屏幕下的展示逻辑
基本上就这些。order 属性不复杂，但在构建灵活布局时非常实用。只要记住它基于数值排序，就能轻松掌握。
