Flexbox 布局生成器 - 可视化 Flex 布局工具 - 五岁小孩

加载中...

Flex 布局生成器

布局预览
1
2
3
项目设置(点击选中项目)
点击预览区域的项目进行单独设置
容器属性
常用布局
CSS 代码

                                        

功能说明

容器属性:设置 Flex 容器的主轴方向、换行、对齐方式等

项目属性:点击项目可单独设置 order、flex-grow、flex-shrink 等

常用布局:一键应用常用的 Flexbox 布局方案

实时预览:所有更改即时反映在预览区域

隐私安全:所有处理均在浏览器本地完成