App下载
Flexbox布局简介
Flexbox布局基础入门 / Flexbox布局简介
1/2

什么是Flexbox

Flexbox 是 flexible box 的简称(灵活的盒子容器),是 CSS3 引入的新的布局模式。它决定了元素如何在页面上排列,使它们能在不同的屏幕尺寸和设备下可预测地展现出来。

它之所以被称为 Flexbox ,是因为它能够扩展收缩 flex 容器内的元素,以最大限度地填充可用空间。与以前布局方式(如 table 布局和浮动元素内嵌块元素)相比,Flexbox 是一个更强大的方式:

  • 在不同方向排列元素
  • 重新排列元素的显示顺序
  • 更改元素的对齐方式
  • 动态地将元素装入容器


虽然Flexbox非常适合缩放,对齐和重新排序元素。但对于部分旧版本的浏览器缺乏兼容性,特别对于IE内核的浏览器,IE11及更低版本的浏览器对于Flexbox的渲染效果不是很友好,部分较低版本甚至直接不支持Flexbox。所以如果需要完全支持旧版本浏览器的项目不建议使用Flexbox。


 注意: Flexbox布局是最合适的一个应用程序的组件,以及小规模的布局,而网格布局是用于较大规模的布局。


+10 经验 +10积分
解析
提示
参考答案
+10 经验 +10积分
参考答案
视频播放结束,是否学习下一节?