软件从业者工具箱
首页
职场准备
个人开发者
辅导作业
退休生活
通用工具
我的收藏
博客文章
关于我们
登录
中文
English
工具
使用指导
意见反馈
Flexbox / Grid 生成器
Flexbox
Grid
排列方向
row
主轴对齐 justify-content
flex-start
交叉轴对齐 align-items
stretch
换行 flex-wrap
nowrap
间距 gap(px)
子元素数量
1
2
3
4
5
复制 CSS
列数
行数
间距 gap(px)
列宽模式
等宽 1fr
auto
子元素数量
1
2
3
4
5
6
复制 CSS
使用指导
可视化选择布局属性，实时预览并生成 CSS。Flex 适合一维排列，Grid 适合二维网格。
意见反馈
当前工具：Flexbox/Grid 生成器
反馈内容
0 / 200
联系方式（选填）
提交反馈
重置
温馨提示
您的反馈将帮助我们改进产品体验
反馈内容会匿名保存，保护您的隐私
我们会认真阅读每一条反馈
反馈历史
暂无反馈记录
扫码关注公众号
扫码关注公众号
row
row-reverse
column
column-reverse
flex-start
center
flex-end
space-between
space-around
space-evenly
stretch
flex-start
center
flex-end
baseline
nowrap
wrap
wrap-reverse
10
10
