Flexbox/Grid 生成器
可视化编辑 CSS Flexbox 和 Grid 布局，实时预览并生成代码
Flexbox 配置
布局预览
1
2
3
4
5
6
CSS 代码
.container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
gap: 10px;
}可视化编辑 CSS Flexbox 和 Grid 布局，实时预览并生成代码
.container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
gap: 10px;
}