布局

如何调整页面或板块的高度、宽度及空白区域？

• 调整首页高度：在页面底部按住调节框向下拖动。

• 调整空白区域高度：拖动页面展示区域的调节按钮，以隐藏多余背景。

• 在空白区域放置文字：先将下方图片下移留出空间，再添加文字。

• 通过 AI 指令调整：截图并选中目标板块后向 AI 发送指令（如“将首页产品中心板块容器宽度调宽”或“将该板块高度调小”），实现自适应调整。

• 限制说明：目前仅支持调整单个控件的尺寸，不支持同时选中多个图层批量调整大小。

PC 端与手机端样式不一致或显示不全怎么办？

• 适配原理：产品采用绝对定位布局，手机端样式基于 PC 端控件自动生成，不支持独立编辑（尊贵版除外）；需调整 PC 端控件使其符合响应式规则。

• 调试方法：在 PC 端按 Shift+Enter 查看控件检测规范，按提示修正影响手机端的布局。

• 头图显示不全：若文字或按钮占比高于图片，为保证内容完整性上下会留白，可通过 AI 调整布局，或接受该留白。

• LOGO 溢出提示：这是开启响应式后的规范检测提示，若实际内容显示正常可忽略。

• 高分辨率缩放适配：建议将 PC 端内容区宽度设为 1200px，并确保主要内容位于该范围内，以适配 125% 等缩放场景。

• 概念区分：SaaS 建站不支持网站级自适应（按不同分辨率自动调整大小），仅支持控件级自适配。

发布后的网站与编辑器预览排版不一致（如页尾错位、布局错乱）怎么办？

• 清除浏览器缓存，或更换浏览器测试。

• 确认没有多人同时编辑；建议全员退出后重新登录再发布。

• 检查页头、页尾与页面宽度设置是否一致。

• 手机端排版问题：在 PC 端按 Alt+P（iOS 按 Option+P）调出手机预览后调整，或关闭手机端独立访问模式。

• 英文版页面布局异常且无法编辑时，尝试刷新页面或重新进入编辑器。

容器

容器是最基础的布局单元，可作为其他控件的包裹层，用于创建独立的视觉区域并统一设置样式。

单击容器控件后，您可以在弹出的设置面板中进行以下配置：

• 排列：精确调整容器的宽度、高度及其在页面中的位置坐标。

• 动效：为容器设置入场动画效果，例如淡入、移入等。

• 样式：为容器设置颜色或图片背景、边框样式以及阴影效果，以增强立体感。若需去除背景，可在样式设置中选择无填充；如需更换背景色，选中容器后在设置选项中单击更换颜色。

除以上设置项外，容器还支持以下进阶用法：

• 圆角与阴影特效：用容器控件包裹文本、图片或按钮后，可在样式中设置圆角、阴影及悬停特效，使内容区域更具层次感。

• 浏览器兼容优化：在 IE、360 浏览器或特定缩放比例下出现排版异常时，可将文字和图片拖入容器控件（拖动至出现移入容器提示后松开），以优化布局。

• 控件归类操作：选中多个控件后按 Ctrl+↑ 可将其置入同一容器；移动时需选中外层容器才能整体移动，容器内的单个控件无法单独选中并一起移动。

• 手机端页脚对齐：按住 Ctrl 多选图片和文字控件，右键选择置入同一容器，把地址、电话、邮箱等信息分别归入各自容器，避免手机端排列错乱。

• 单独移动容器内元素：如需单独移动容器内的某个元素，不要按住整体移动按钮，应单击文字或图案以外的空白位置选中该元素后再拖动。

• 容器居中对齐：将容器宽度调整为与内容一致后，右键选择对齐 > 页面居中，可使容器在页面中居中显示。

自适应布局

自适应布局用于创建宽度撑满父容器的通栏区块，常用于页面顶部的导航栏或底部的页脚。

单击自适应布局控件后，您可以在弹出的设置面板中进行以下配置：

• 排列：设置自适应布局的高度和垂直位置。其宽度始终自适应父容器，不可手动设置。

• 样式：为该布局切换样式，设置通栏背景（撑满浏览器窗口宽度的背景颜色或图片）、边框及阴影。若需去除背景，可选择无填充；如需更换页头位置或轮播图的背景色，选中对应容器或控件后在设置选项中单击更换颜色。

使用自适应布局时，如果遇到以下显示异常，可按对应方法处理：

• 控件不显示或一闪而过：将 Logo、语言切换控件加入自适应布局后，若不显示或一闪而过，先删除该控件，再重新添加并拖入自适应布局；同时检查 Logo 所在的层级，避免白色背景遮挡。

• 小屏幕下顶部组件错位：电话、邮箱、语言切换等顶部组件在小屏幕下出现错位，通常是由两个自适应布局相互冲突导致的。将冲突的自适应布局整合为一个，并把背景图调整为上黑下白的渐变样式，以保留原有的视觉效果。

标签布局

标签布局通过Tab切换的形式，在有限空间内展示不同分类的内容。

单击标签布局控件后，您可以在弹出的设置面板中进行以下配置：

• 排列：调整整个标签布局控件的大小和在页面中的位置。

• 编辑：

  • 添加标签：增加标签页。

  • ：修改在导航区显示的标签文本和背景、为标签设置跳转链接及其打开方式（如新窗口打开）。

  • ：删除标签页。

• 交互：设置切换标签页的方式为鼠标单击切换或鼠标悬停切换。

• 样式：

  • 标签设置：分别设置标签在默认、悬停和选中状态下的背景、字体颜色等。

  • 区域内容设置：设置内容面板区域的背景、边框等。

  • 阴影：为整个标签布局控件添加阴影。

多栏布局

多栏布局可将内容水平分割为多栏，适用于创建侧边栏、卡片列表等左右结构。

单击多栏布局控件后，您可以在弹出的设置面板中进行以下配置：

• 排列：调整整个多栏布局控件的高度和垂直位置。其宽度始终自适应父容器，不可手动设置。

• 编辑：

  • 添加栏目：增加布局的列数。

  • ：为单个栏目设置独立的背景。

  • ：删除栏目。

• 样式：

  • 宽度：选择通栏（撑满浏览器窗口）或页面宽度（与页面主体内容对齐）。

  • 比例：设置各栏的宽度比例，可选择均分或手动调整比例。

  • 列间距：调整相邻两栏之间的水平间距。

  • 背景：为整个多栏布局设置统一的背景。