📚前端面试题速记
Q38

常见 CSS 布局方式有哪些?

速记答案(30 秒)

普通流 + display:block/inline/inline-block。float 布局。position 定位布局。Flex 布局。Grid 布局。多列(column-*)、表格布局等。

📖 详细讲解

标准面试回答(推荐记住)

常见的 CSS 布局方式有很多。最基础的是普通流布局,配合 display 的 block、inline、inline-block。float 浮动布局曾经是主流,但需要清除浮动。position 定位布局用于特殊场景。现代主流是 Flex 弹性布局和 Grid 网格布局,Flex 适合一维布局,Grid 适合二维布局。还有 column-* 多列布局用于类似报纸的分栏,table 表格布局用于数据展示。不同场景选择不同的布局方式。

面试要点

  • Flex 和 Grid 是现代主流
  • Flex 一维,Grid 二维
  • 根据场景选择布局方式