CSS 布局生成器说明
在左侧选择 Flexbox 或 Grid，再通过下拉框与数字输入调整方向、主轴 / 交叉轴对齐、换行、列数、行高与间距，右侧演示区会用几个彩色子块实时呈现布局效果，所见即所得。
调好后下方会输出对应的声明式 CSS（Flex 的 display / flex-direction / justify-content / align-items / flex-wrap / gap，Grid 的 display / grid-template-columns / grid-auto-rows / gap），点击复制即可用于项目。全程浏览器本地运行，不依赖任何外部库。