相比于PC端，DataV的移動端可視化界面有許多新功能，例如，可滾動的流式布局、按比例響應式的內容縮放、組件和數據的懶加載功能等。本文為您介紹移動端編輯器的元素概念和單位說明，有助于您后續了解使用移動端編輯器。
概念定義
移動端編輯器中有三個元素概念需要區分，分別為容器、格子和組件。
元素概念 | 說明 |
容器 | 容器是用于組織移動端內容，控制流式畫布中內容布局的元素，目前移動端畫布編輯中提供的容器有以下三種。（從左至右分別為：普通容器、多列容器、多行容器）
|
格子 | 格子區域用于支持拖入組件或者容器，如下圖容器內部的灰色及藍色實線框所示。 |
組件 | 可視化應用中內容的載體，與DataV傳統的PC端畫布編輯器的組件一樣，是可視化應用用于進行視覺傳達的元素。 |
單位說明
在移動端編輯器中將使用到兩種單位：vw和%。
單位 | 說明 |
vw | vw表示當前容器寬高相對于當前頁面寬度的大小。例如，設置60的高度表示容器真實高度是頁面寬度的60%，您在寬度像素為375px的手機上會渲染出225px高度的內容。該單位主要用于定義最外層容器的高度、容器和格子的內外邊距等等。 |
% | %表示當前寬高相對于父元素的大小。例如，某格子的布局占比為40%，則意味著它占父容器的寬或者高的40%，具體是寬度還是高度，取決于父容器的類型。該單位主要用于格子布局占比的程度。 |
文檔內容是否對您有幫助？