元素 — 分隔線

在Page Builder面板中，展開​ Elements ​並將​ Divider ​預留位置拖曳至舞台上的列、欄或索引標籤集。

當您在舞台上另一個內容容器之前或之後放置分隔線時，請使用紅色指引作為參考。

{width="600" modal="regular"}

在下列範例中，分隔線會標籤文字新區段的開頭。

{width="500" modal="regular"}

若要指定新分隔線的設定，請遵循下列程式。

將滑鼠懸停在分隔線容器上以顯示工具箱，然後選擇​ 設定 （ {width="20"} ）圖示。

{width="500" modal="regular"}

使用下列其中一種方法變更分隔線​ Line Color：

• 請輸入有效的HTML色彩名稱。 例如，Teal。
• 輸入十六進位色彩值。 例如，#008080。

完成時，按一下​ Apply。

{width="600" modal="regular"}

輸入​ Line Thickness ​畫素。

若要指示測量單位，請輸入​ Line Width，然後輸入px或%。

{width="600" modal="regular"}

視需要更新​ Advanced ​設定。

• 若要控制分隔線在父容器中的位置，請選擇​ Alignment：

  table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto
  選項	說明
  Default	套用目前佈景主題樣式表中指定的對齊預設設定。
  Left	沿著父容器的左邊框對齊清單，並允許指定的任何邊框間距。
  Center	將清單對齊父項容器的中心，並容許任何指定的內距。
  Right	沿著父容器的右邊框對齊區塊，並允許指定的任何邊框間距。

  在下列範例中，選項設定為使用分隔線的中心對齊。

  {width="600" modal="regular"}

• 設定套用至分隔線容器所有四個邊的​ Border ​樣式：

  table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 5-row-2 6-row-2 7-row-2 8-row-2 9-row-2 10-row-2 layout-auto
  選項	說明
  Default	套用關聯樣式表所指定的預設邊框樣式。
  None	未提供任何容器框線的可見指示。
  Dotted	容器邊框會以虛線顯示。
  Dashed	容器邊框會以虛線顯示。
  Solid	容器邊框會以實線顯示。
  Double	容器邊框會以雙線顯示。
  Groove	容器框線會顯示為槽線。
  Ridge	容器框線會顯示為脊線。
  Inset	容器框線會顯示為內嵌線。
  Outset	容器邊框會顯示為外線。

• 如果您設定了None以外的框線樣式，請完成框線顯示選項：

  table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto
  選項	說明
  Border Color	選擇色票、按一下檢色器，或輸入有效的顏色名稱或相等的十六進位值，以指定顏色。
  Border Width	輸入邊框線條寬度的畫素數。
  Border Radius	輸入畫素數目，以定義用來將邊框每個角落倒圓角的半徑大小。

• （選擇性）從目前的樣式表中指定要套用至容器的​ CSS classes ​名稱。

  以空格分隔多個類別名稱。

• 輸入​ Margins and Padding ​的值（以畫素為單位），以決定分隔線容器的外部邊界和內邊距。

  在圖表中輸入對應的值。

  table 0-row-2 1-row-2 2-row-2 layout-auto
  容器區域	說明
  Margins	套用至容器所有側邊外部邊緣的空白空間量。 選項： Top / Right / Bottom / Left
  Padding	套用至容器所有邊內側邊緣的空白空間量。 選項： Top / Right / Bottom / Left

完成後，按一下​ Save ​套用設定並返回Page Builder工作區。

{width="500" modal="regular"}

將滑鼠懸停在分隔線容器上以顯示工具箱，然後選擇​ 複製 （ {width="20"} ）圖示。

重複分隔線容器會出現在原始分隔線的正下方。

{width="500" modal="regular"}

將滑鼠停留在新的分隔線容器上以顯示工具箱，並選擇​ 移動 （ {width="20"} ）圖示。

{width="500" modal="regular"}

選取並拖曳分隔線，直到紅色指引標籤新位置為止。

分隔線移動時，每個容器的頂端和底部邊界會顯示為虛線。

{width="500" modal="regular"}