添加分隔线.

学习 DXPR Builder搭建页面添加内容数据与动效

干净的水平线把页面分成清晰的版块。页面需要视觉分隔时,用在文本、图片或其他元素之间。

居中的紫色分隔线,粗 6 px,长 300 px,位于标题 Our services 与其段落之间

添加分隔线

登录后打开页面:悬停内容区即出现构建器控件。您的第一页介绍基础操作。

  1. 悬停列,点击其控制栏中的 +;空白页面请点击 Add Elements。打开 Content 选项卡并点击 Divider。它落在列顶部,没有对话框。用其控制栏中的手柄拖动可移动。
  2. 线很细,请悬停线本身显示其控制栏。点击 More,选择 Settings 并选择 Color。
  3. 在 Thickness 下,选择 Custom thickness。
  4. 拖动 Thickness 滑杆设置线宽。这里用 6 px。
  5. 在 Length 下,选择 Custom width。
  6. 拖动 Width 滑杆设置线长。这里用 300 px。
  7. 将 Align 设为 Center。
  8. 点击对话框中的 Save。再点击内容区顶部工具栏中的 Save 保存页面。

您会看到的内容

水平线按您选择的颜色、粗细和长度横跨该列。视频中它粗 6 px,长 300 px,居中。保存并发布页面后访客可见。

设置您的分隔线

悬停元素,在其控制栏打开 More > Settings。选项:

  • Color: 线的颜色。留空则用主题颜色。
  • Thickness: Theme default 或 Custom thickness。Custom 增加 Thickness 滑杆,0 到 20 px。
  • Length: Theme default 或 Custom width。整行全宽请保持 Length 为 Theme default。Custom 增加 Width 滑杆,0 到 500 px。
  • Align: Left、Center 或 Right。只在 Custom width 下显示。

如果看不到它

  • Content 选项卡中没有 Divider。 您的用户档案隐藏了它。请管理员勾选 Separator(Elements 下,用户档案)。
  • 重新加载后消失。页面未保存。请重新添加并点击内容区顶部工具栏中的 Save。
  • 分隔线在内容上方。新元素落在列顶部。请悬停线并用手柄拖动,或打开 More > Move Down。
  • 线看不见。其中 Color 与页面背景相同。请悬停元素打开 More > Settings,选择对比色。
  • 线没有铺满全宽。 Length 设为 Custom width。请悬停元素打开 More > Settings,将 Length 设回 Theme default。

接下来做什么?

样式选项卡:改变分隔线周围的间距。