Layout Header and Footer | Quasar Framework

為何捐款

API 瀏覽器

如何貢獻

選項 & 輔助工具

樣式 & 識別

版面配置和網格

彈性網格

Vue 元件

Vue 指令

Quasar 插件

Vue 組合式函式

安全性

Quasar CLI (搭配 Vite)

Quasar CLI (搭配 Webpack)

Icon Genie CLI

應用程式擴充套件

Quasar 工具

佈局標頭與頁尾

QLayout 允許您將視圖配置為 3x3 矩陣，其中包含可選的標頭和/或頁尾（主要用於導航欄，但可以是任何內容）。如果您尚未閱讀，請先閱讀 QLayout 文件頁面。

佈局產生器

點擊下方按鈕來建立您的佈局。

佈局產生器

用法

提示

由於標頭和頁尾需要佈局，而 QLayout 預設管理整個視窗，因此為了示範目的，我們將使用容器化的 QLayout。但請記住，您絕不需要為 QHeader 或 QFooter 使用容器化的 QLayout。

您可以在標頭和頁尾的工具列上使用 glossy 類別。

各種內容

顯示屬性

在以下範例中，滾動頁面以查看 QHeader 和 QFooter 的行為。

iOS 外觀與風格

在以下範例中，您可以將 Ionicons 圖示 (v4) 與 QTabs 的 ion-ios- 前綴一起使用，這將完美匹配 iOS 的外觀與風格。

桌面應用程式外觀與風格

如果您建置 Electron 應用程式並隱藏預設應用程式框架，則以下範例特別有用。

發現錯誤了嗎？在瀏覽器中編輯此頁面

1. 介紹

2. QHeader API

3. QFooter API

4. 佈局產生器

5. 用法

5.1. 各種內容

5.2. 顯示屬性

5.3. iOS 外觀與風格

5.4. 桌面應用程式外觀與風格