在每个设备上显示/隐藏元素或部分

使用 GemPages，您可以 控制特定元素或部分的可见性 跨设备，确保您的页面在桌面和移动设备上均能完美显示。

例如，桌面端的设计和内容可能并不适合移动设备。通过根据屏幕尺寸显示和隐藏元素，您可以确保更流畅、更有效的用户体验。

假设你正在为你的网站设计一个号召性用语（CTA）按钮：

• 桌面：你希望 CTA 更大、更详细

• 电话：因为屏幕空间有限，所以选择更精简的版本就这么简单。

通过使用 GemPages 的显示/隐藏功能，您可以创建同一按钮的不同版本，并对其进行自定义以适应每种屏幕尺寸的独特要求。

如何显示和隐藏元素？

第三步： 在 GemPages 编辑器中，添加新元素或单击要为不同设备自定义的现有元素。

对于这个例子，我们假设你正在使用 号召性用语（CTA） 按钮。

第三步： 在 GemPages 中，复制 CTA 按钮以创建两个单独的 CTA 按钮：一个用于桌面，一个用于移动设备。

第三步： 根据您的喜好自定义两个按钮。

第三步： 设置显示属性

• 选择您想仅在桌面上显示的按钮。在 先进的 标签，使用 开启显示 设置以确保它仅出现在桌面屏幕上。

• 选择另一个适用于移动设备的，调整 开启显示 设置将其从桌面视图中隐藏，但保持在移动设备上可见。

如何显示和隐藏某个部分？

您还可以根据屏幕尺寸显示和隐藏整个部分。如果您有大量内容块或特定功能无法在较小的屏幕上很好地显示，此功能特别有用。

第三步： 选择您想要在移动设备上隐藏的部分。

第三步： 一旦选择了元素，设置就会出现在编辑器的右侧。

点击 高级选项卡 在设置面板顶部。使用 显示在 调整可见性的功能。

• 展示 该部分仅在桌面屏幕上显示。
• 隐藏 在移动设备上查看时。

常见问题

为什么iPhone上的显示/隐藏功能不起作用？

• 检查显示屏开启设置： 请确保该元素或部分已启用。 电话 在“高级”选项卡中。如果它在移动设备上被隐藏，则在 iPhone 上也不会显示。
• 避免元素重叠： 在移动设备上，某个元素可能技术上可见，但被其他部分或元素遮挡。请检查间距、位置（尤其是绝对定位/粘性定位）以及 z-index（如果使用）。
• 清除缓存并刷新： 如果最近进行了更改，请清除浏览器缓存或刷新 iPhone 上的页面，以确保加载最新版本。