Flexbox 专注一维布局，适合构建自适应组件与导航。

核心概念

• 主轴、侧轴概念决定元素对齐方式。
• flex-grow、flex-shrink、flex-basis 控制空间分配。
• 容器与项目属性需协同配置。

实战步骤

• 实现响应式导航栏与卡片布局。
• 使用 gap 替代 margin 控制间距。
• 结合媒体查询调整 flex-direction。