Grid template & area
ページレイアウトのための強力で柔軟なテンプレートシステムです。
How it works
GidTemplateコンポーネントはPageLayoutの内部で利用されています。
より詳細なカスタマイズが必要なレイアウトを作成する場合などに利用できるコンポーネントです。
Examples
Basic
GridAreaコンポーネントを利用して各エリアを作成します
GridAreaコンポーネントのarea 属性にエリア名を付けます。エリア名はアルファベット一意な1文字である必要があります。
作成した全てのGridAreaコンポーネントを、GridTemplate コンポーネントに含めます。
GridTemplateコンポーネントのareas属性で、各エリアの配置を指定します。 上の行の最初の列から順番に、エリア名を記載します。改行は空白文字を記載します。
rows属性で各行のサイズを、columns属性で各列のサイズを指定します。
Top area
Start aside area
Center area
End aside area
Bottom area
vue
Responsive
Top area
Start aside area
Center area
End aside area
Bottom area
vue