截面積

div 區塊概述-網站建置中最基本、最通用的元素。

區域是網站建設中使用的基本且適應性強的單位。按鈕、包裝紙和段都是具有特定附加功能的部分區域。在某種程度上,截面區域可以呈現您想要的任何形狀。例如,截面區域可以用作墊片或分隔符,但它們最常見的用途是將其他組件組合在一起。它在 HTML document 中描繪了一個分割區。

在本教程中,您將了解如何:

  1. 整合剖面面積
  2. 將截面區域轉換為連結區域
  3. 使用剖面區域建立組件之間的間隙

整合剖面面積

您可以透過「插入」面板在 Webflow 網站上新增一個分割區區域。隨後,您可以合併部分區域內的其他組件,例如標題、描述和號召性用語按鈕。透過包含一個剖面區域並將這三個元素拖入其中,可以對它們進行集體修改和管理。將分區寬度調整為 50% 也會將內部內容調整為 50%。

將元素嵌套在節區域內時,其大小將根據嵌入的內容自動一致。將部分區域與中心對齊同樣會對齊其內容。

將截面區域轉換為連結區域

您可以將節區域轉換為連結區域,以將其(以及其中包含的內容)超連結到其他目標。如果您在對內容進行分組時無意中使用了分區區域而不是連結區域,那麼這將非常有利。

若要將剖面區域轉換為連結區域,請確保剖面區域內沒有連結元素,然後右鍵單擊剖面區域並選擇 轉換為連結區域.

使用剖面區域建立組件之間的間隙

您可以利用分區區域在其他元件之間產生空白空間(並指定固定的高度或寬度以重新定位其他內容)。然而,這種技術對於創造空間來說並不是最佳的,並且隨著時間的推移可能難以監控。作為基本準則,最好利用邊距或填充在組件之間創建空間,並且僅在絕對必要時才使用截面區域。

麥伊凡
Ewan Mak 的最新帖子 (看全部)