使用步骤
- 设置 flex-direction、flex-wrap 和 justify-content。
- 调整 align-items 和 align-content。
- 复制生成的 Flexbox CSS 代码。
设计工具
Flexbox 生成器
可视化调试方向、换行、主轴和交叉轴对齐，生成 Flexbox CSS。
本地简单运行
使用指南
开始使用
用可视化面板调整 Flexbox 属性，实时查看子元素排列效果并生成 CSS 代码。
使用例子
- 设计水平垂直居中的 Flexbox 布局。
- 调试响应式导航栏的子元素排列。
加载中
Flexbox 生成器
工具微前端加载中。