如何使用响应式模式

作者:

在

如何使用响应式模式

从 4.0 版本开始,您现在可以在编辑时在桌面、平板电脑和手机视图之间切换!我们称之为响应式模式。在响应式模式下,您的网站将调整为较小的尺寸,以模拟您的网站在较小屏幕上的显示效果。

受限的编辑功能

在平板电脑或手机视图中查看您的网站时,您将拥有受限的编辑功能。在此状态下,您只能执行以下操作:

  • 编辑文本
  • 使用文本格式工具栏设置文本样式
  • 调整元素和行的部分外边距 *
  • 在平板电脑或手机中隐藏行

* PBS 会对您的元素和行应用某些响应式样式,因此某些外边距将无法调整。

以下是您无法执行的操作:

  • 添加、删除、拖动元素
  • 查看元素属性
  • 调整图像、图标、行和其他可调整大小元素的大小

针对特定屏幕尺寸调整外边距

如果您在平板电脑或手机视图中查看网站,您进行的任何外边距调整都仅适用于当前视图和更小的视图。这使您可以对设计进行微调,使其在较小屏幕上看起来更美观,且与完整的桌面版本相互独立。

以下是一个示例,以便更清楚地进行说明。

  1. 如果您在平板电脑模式下查看网站并调整标题的外边距,该调整将仅应用于平板电脑屏幕。同时该调整也会应用于手机屏幕。如果您返回桌面模式,将恢复原始外边距。
  2. 现在,如果您进入手机模式并再次进一步调整同一外边距,该调整将仅应用于手机屏幕。之后,您将在桌面、平板电脑或手机上拥有不同的外边距。

这仅适用于外边距调整,文本更改或文本样式更改将应用于所有屏幕尺寸。

在平板电脑或手机尺寸中隐藏内容

在平板电脑或手机视图中查看时,当您将鼠标悬停在行上时,会显示一个新的“眼睛”工具栏按钮。单击此按钮将允许您在当前屏幕尺寸下显示/隐藏该行。

隐藏的行在编辑时会变得略微透明,以表明在您完成编辑后它们将被隐藏。

请注意,此功能仅适用于行。