调整视口大小

在创建自适应布局时,如果可以查看文档在不同尺寸屏幕中的显示效果,将会很有帮助。Google Web Designer 允许调整视口大小,以确保您针对相应屏幕尺寸和方向指定的样式适用于场景中的文档。

如果主规则在“自适应”面板中处于选中状态,系统将仅应用通用样式。要启用取决于视口的样式,请执行以下操作:

  • 在“自适应”面板中,选择媒体查询标签中的媒体规则
  • 对于双向广告,请改为选择横向规则纵向规则

使用鼠标手动调整视口大小

  1. 选择工具栏中的调整视口大小 工具。视口周围随即会显示一个边框。
  2. 视口边框上会显示多个浅灰色手柄,请视需要拖动其中一个。
    • 按下 Shift 键的同时进行拖动,可保持原始宽高比。

指定确切的视口大小

  1. 选择工具栏中的调整视口大小 工具。
  2. 要使宽高比保持不变,请选择顶部工具选项栏上的锁定宽高比 按钮。
  3. 在工具选项栏中更改宽度和高度值。

使视口大小在尺寸范围内

  • 在带颜色的范围内点击水平标尺或垂直标尺。

选择预设视口大小

  1. 选择工具栏中的调整视口大小 工具。
  2. 从工具选项栏的预设下拉菜单中选择所需的尺寸。

添加自定义预设视口尺寸

  1. 选择调整视口大小 工具。
  2. 将视口设为您想要保存的大小。
  3. 点击工具选项栏中的添加自定义视口尺寸 按钮。当前视口尺寸随即会显示在预设下拉菜单中的自定义尺寸下方。

在横向和纵向之间切换视口

  1. 选择工具栏中的调整视口大小 工具。
  2. 点击工具选项栏中的翻转方向 按钮,即可将宽度和高度值对调。

预览多种视口尺寸

使用所有尺寸预览模式,可以在浏览器中一目了然地查看多种视口尺寸。 此预览模式仅适用于自适应文档。

该内容对您有帮助吗?
您有什么改进建议?

需要更多帮助?

登录可获取更多支持选项,以便快速解决您的问题