MasterGo AI不直接生成网格系统，而是生成完整界面设计稿，网格需设计师后续在关键容器中手动配置。操作分三步：先用AI生成高保真页面；再将区域转为容器并添加适配的网格类型；最后通过吸附功能实现精准对齐。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
MasterGo AI 本身不直接生成“网格系统”，它生成的是完整界面设计稿（比如官网首页、产品页等），而网格系统是设计师在后续精细化排版时手动配置的底层对齐结构。AI 负责快速产出视觉框架，网格负责确保元素精准对齐——二者分工明确，需配合使用。
要让官网设计既快又规范，关键是：先用 AI 生成高保真页面 → 再在关键容器上叠加合适的布局网格。下面分三步说清楚怎么做：
官网页面用 AI 一键生成
打开 MasterGo → 新建文件 → 点击顶部「AI 图标」→ 选择「AI 生成界面」→ 输入清晰描述。例如：
- “生成科技公司官网首页：含顶部导航栏、主视觉大图、三大核心功能模块（简洁图标+标题+短描述）、客户展示区（横向滚动LOGO墙）、底部联系表单”
- 补充参数：“主题色 #2563EB，圆角 8px，亮色模式，适配桌面端”
回车后等待约 10 秒，AI 输出完整布局，点击「插入到画布」即可获得可编辑的设计稿。
在关键区域添加网格容器
AI 生成的页面是普通图层组合，不能直接加网格。你需要：
- 选中某一块区域（如“功能模块区”或“客户LOGO区”）→ 右键 → 「转换为容器」（或按 Cmd/Ctrl + Shift + C）
- 确保该容器未启用「自动布局」（右侧属性栏关闭它）→ 此时「布局网格」选项才会出现
- 点击「+」号添加网格类型：
- 小图标/文字对齐 → 选「网格」，尺寸设为 8 或 12，颜色浅灰（#E0E0E0）
- 多列内容区（如三栏功能区）→ 选「栅格列」，数量填 12，槽宽 24，偏移 32（适配常规网页宽度）
注意：偏移值必须小于容器宽度的一半，否则栅格不可见；一个容器可叠加多个网格（比如外层12列控结构，内层4px网格精调图标位置）。
让网格真正起作用的小细节
- 网格开启后，拖动子元素靠近网格线时会出现蓝色虚线和“吸附”提示，松手即自动对齐
- 已有元素不会自动重排，需手动拖动触发吸附；若想批量对齐，可框选多个图层后拖拽至网格交点
- 导出交付前，勾选网格设置里的「仅预览」，避免网格线被误导出
基本上就这些。AI 解决“从无到有”，网格解决“从有到准”，两者结合，官网设计既快又经得起开发还原。
