陰影
分段按鈕是 分段 內相關按鈕的群組。它們會顯示在水平列中。您可以透過將分段的 value 設定為分段按鈕的 value 來預設選取分段按鈕。一次只能選取一個分段按鈕。
預設情況下，layout 屬性會設定為 "icon-top"。當分段按鈕同時具有圖示和標籤時，它會將圖示顯示在標籤上方。可以透過將 layout 屬性設定為 "icon-bottom"、"icon-start" 或 "icon-end" 來變更此行為，這會分別將圖示顯示在標籤下方、標籤的開頭（在 LTR 中為左側，在 RTL 中為右側）或標籤的結尾（在 LTR 中為右側，在 RTL 中為左側）。
contentId
| 描述 | 分段內容的 id。 |
| 屬性 | content-id |
| 類型 | 字串 ｜ 未定義 |
| 預設值 | 未定義 |
| 描述 | 如果為 true，則使用者無法與分段按鈕互動。 |
| 屬性 | disabled |
| 類型 | 布林值 |
| 預設值 | false |
| 描述 | 設定分段中文字和圖示的版面配置。 |
| 屬性 | layout |
| 類型 | "icon-bottom" ｜ "icon-end" ｜ "icon-hide" ｜ "icon-start" ｜ "icon-top" ｜ "label-hide" ｜ 未定義 |
| 預設值 | 'icon-top' |
| 描述 | 模式會決定要使用哪個平台樣式。 |
| 屬性 | mode |
| 類型 | "ios" ｜ "md" |
| 預設值 | 未定義 |
| 描述 | 按鈕的類型。 |
| 屬性 | type |
| 類型 | "button" ｜ "reset" ｜ "submit" |
| 預設值 | 'button' |
| 描述 | 分段按鈕的值。 |
| 屬性 | value |
| 類型 | 數字 ｜ 字串 |
| 預設值 | 'ion-sb-' + ids++ |
此元件沒有可用的事件。
此元件沒有可用的公用方法。
| 名稱 | 描述 |
|---|
indicator | 顯示在已核取分段按鈕上的指示器。 |
indicator-background | 顯示在已核取分段按鈕上的指示器的背景元素。 |
native | 包裝所有子元素的原生 HTML 按鈕元素。 |
| 名稱 | 描述 |
|---|
--background | 分段按鈕的背景 |
--background-checked | 已核取分段按鈕的背景 |
--background-focused | 當使用 Tab 鍵聚焦時，分段按鈕的背景 |
--background-focused-opacity | 當使用 Tab 鍵聚焦時，分段按鈕背景的不透明度 |
--background-hover | 滑鼠懸停時，分段按鈕的背景 |
--background-hover-opacity | 滑鼠懸停時，分段按鈕背景的不透明度 |
--border-color | 分段按鈕邊框的顏色 |
--border-radius | 分段按鈕邊框的半徑 |
--border-style | 分段按鈕邊框的樣式 |
--border-width | 分段按鈕邊框的寬度 |
--color | 分段按鈕的顏色 |
--color-checked | 已核取分段按鈕的顏色 |
--color-focused | 當使用 Tab 鍵聚焦時，分段按鈕的顏色 |
--color-hover | 滑鼠懸停時，分段按鈕的顏色 |
--indicator-box-shadow | 已核取分段按鈕指示器的陰影方塊 |
--indicator-color | 已核取分段按鈕指示器的顏色 |
--indicator-height | 已核取分段按鈕指示器的高度 |
--indicator-transform | 已核取分段按鈕指示器的轉換 |
--indicator-transition | 已核取分段按鈕指示器的轉換 |
--margin-bottom | 分段按鈕的下邊距 |
--margin-end | 如果方向為由左至右，則為分段按鈕的右邊距；如果方向為由右至左，則為左邊距 |
--margin-start | 如果方向為由左至右，則為分段按鈕的左邊距；如果方向為由右至左，則為右邊距 |
--margin-top | 分段按鈕的上邊距 |
--padding-bottom | 分段按鈕的下邊距 |
--padding-end | 如果方向為由左至右，則為分段按鈕的右邊距；如果方向為由右至左，則為左邊距 |
--padding-start | 如果方向為由左至右，則為分段按鈕的左邊距；如果方向為由右至左，則為右邊距 |
--padding-top | 區段按鈕的上邊距 |
--transition | 區段按鈕的過渡效果 |
| 名稱 | 描述 |
|---|
--background | 分段按鈕的背景 |
--background-checked | 已核取分段按鈕的背景 |
--background-focused | 當使用 Tab 鍵聚焦時，分段按鈕的背景 |
--background-focused-opacity | 當使用 Tab 鍵聚焦時，分段按鈕背景的不透明度 |
--background-hover | 滑鼠懸停時，分段按鈕的背景 |
--background-hover-opacity | 滑鼠懸停時，分段按鈕背景的不透明度 |
--border-color | 分段按鈕邊框的顏色 |
--border-radius | 分段按鈕邊框的半徑 |
--border-style | 分段按鈕邊框的樣式 |
--border-width | 分段按鈕邊框的寬度 |
--color | 分段按鈕的顏色 |
--color-checked | 已核取分段按鈕的顏色 |
--color-focused | 當使用 Tab 鍵聚焦時，分段按鈕的顏色 |
--color-hover | 滑鼠懸停時，分段按鈕的顏色 |
--indicator-box-shadow | 已核取分段按鈕指示器的陰影方塊 |
--indicator-color | 已核取分段按鈕指示器的顏色 |
--indicator-height | 已核取分段按鈕指示器的高度 |
--indicator-transform | 已核取分段按鈕指示器的轉換 |
--indicator-transition | 已核取分段按鈕指示器的轉換 |
--margin-bottom | 分段按鈕的下邊距 |
--margin-end | 如果方向為由左至右，則為分段按鈕的右邊距；如果方向為由右至左，則為左邊距 |
--margin-start | 如果方向為由左至右，則為分段按鈕的左邊距；如果方向為由右至左，則為右邊距 |
--margin-top | 分段按鈕的上邊距 |
--padding-bottom | 分段按鈕的下邊距 |
--padding-end | 如果方向為由左至右，則為分段按鈕的右邊距；如果方向為由右至左，則為左邊距 |
--padding-start | 如果方向為由左至右，則為分段按鈕的左邊距；如果方向為由右至左，則為右邊距 |
--padding-top | 區段按鈕的上邊距 |
--transition | 區段按鈕的過渡效果 |
此元件沒有可用的插槽。