CSS 布局经历了从 float 到 Flexbox 再到 Grid 的演变。

Flexbox 适合一维布局：

  • 导航栏
  • 卡片同行排列
  • 居中对齐

Grid 适合二维布局：

  • 整体页面结构
  • 文章列表网格
  • 复杂仪表盘

实际项目中，两者经常结合使用：

  • Grid 定义整体框架
  • Flexbox 处理组件内部布局

现代 CSS 还引入了容器查询、层叠层等新特性，让布局更加灵活。