ion-title

陰影

Title 是一個文字元件，用於設定 工具列 的標題。它可以用於描述使用者目前所在的螢幕或區段，或正在使用的應用程式。

基本

可摺疊的大標題

當 內容 滾動到滾動容器的開頭時，會顯示大標題。當標題滾動到標頭後面時，縮小的標題會淡入。

資訊

此功能僅適用於 iOS。

可摺疊的按鈕

按鈕 元件可以與 collapse 屬性一起使用，以在工具列摺疊時額外顯示在標頭中。

協助工具

標題

建立標題時，我們通常建議使用 語意標題元素 (h1-h6)。但是，在某些情況下，您可能需要更新標題，使其被輔助技術視為特定標題。例如，如果您在檢視頂端有一個標題，您可能會希望將其視為第 1 級標題。

為了實現這一點，開發人員應在標題上使用 heading 角色。這將向輔助技術指出標題是一種標題類型。從那裡，開發人員應使用 aria-level 屬性來設定標題級別。

例如，如果我們想要讓標題的行為類似於 h1 元素，我們會在標題上設定 role="heading" 和 aria-level="1"。當使用 焦點管理器 時，這是必要的。

由於可以在檢視中使用多個標題元素，並與語意標題元素結合使用，因此 Ionic 不會自動設定標題的 role 或 aria-level。開發人員有責任處理此問題。

主題

可摺疊的大標題應與其餘內容無縫銜接。這表示包含可摺疊大標題的工具列的背景顏色應始終與內容的背景顏色相符。

預設情況下，包含標準標題的工具列會使用 opacity: 0 隱藏，並在您透過滾動摺疊大標題時逐步顯示。因此，您在標準標題後面看到的背景顏色實際上是內容的背景顏色。

您可以透過設定 --background CSS 變數來變更具有標準標題的工具列的背景顏色。這會產生當您摺疊大標題時標頭顏色會變更的效果。

在設定大標題的文字顏色樣式時，您應以全域方式鎖定大標題，而不是在特定頁面或分頁的內容中，否則其樣式不會在導覽動畫期間套用。

CSS 自訂屬性

屬性

顏色

說明	要從應用程式的調色盤使用的顏色。預設選項為："primary"、"secondary"、"tertiary"、"success"、"warning"、"danger"、"light"、"medium" 和 "dark"。如需有關顏色的詳細資訊，請參閱主題。
屬性	color
類型	"danger" ｜ "dark" ｜ "light" ｜ "medium" ｜ "primary" ｜ "secondary" ｜ "success" ｜ "tertiary" ｜ "warning" ｜ string ｜ undefined
預設值	undefined

大小

說明	工具列標題的大小。
屬性	大小
類型	"large" ｜ "small" ｜ undefined
預設值	undefined

事件

此元件沒有可用的事件。

方法

此元件沒有可用的公用方法。

CSS 陰影部件

此元件沒有可用的 CSS 陰影部件。

CSS 自訂屬性

iOS

名稱	說明
--color	標題的文字顏色

MD

名稱	說明
--color	標題的文字顏色

插槽

此元件沒有可用的插槽。