ion-item-divider
Item dividers are block elements that can be used to separate items in a list. They are similar to list headers, but instead of only being placed at the top of a list, they should go in between groups of items.
Basic Usage
Theming
Colors
CSS Custom Properties
Properties
color
| Description | The color to use from your application's color palette. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark". For more information on colors, see theming. |
| Attribute | color |
| Type | "danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string | undefined |
| Default | undefined |
mode
| Description | modeは、どのプラットフォームのスタイルを使用するかを決定します。 |
| Attribute | mode |
| Type | "ios" | "md" |
| Default | undefined |
sticky
| Description | When it's set to true, the item-divider will stay visible when it reaches the top of the viewport until the next ion-item-divider replaces it.This feature relies in position:sticky: https://caniuse.com/#feat=css-sticky |
| Attribute | sticky |
| Type | boolean |
| Default | false |
Events
No events available for this component.
Methods
No public methods available for this component.
CSS Shadow Parts
No CSS shadow parts available for this component.
CSS Custom Properties
| Name | Description |
|---|---|
--background | アイテムディバイダーの背景 |
--color | アイテムディバイダーの色 |
--inner-padding-bottom | アイテムディバイダーのBottom Inner Padding |
--inner-padding-end | アイテムディバイダーのEnd Inner Padding |
--inner-padding-start | アイテムディバイダーのStart Inner Padding |
--inner-padding-top | アイテムディバイダーのTop Inner Padding |
--padding-bottom | アイテムディバイダーのBottom Padding |
--padding-end | アイテムディバイダーの方向が左から右の場合はRight Padding、右から左の場合はLeft Padding |
--padding-start | アイテムディバイダーの方向が左から右の場合はLeft Padding、右から左の場合はRight Paddingとなります。 |
--padding-top | アイテムディバイダーのTop Padding |
Slots
| Name | Description |
|---|---|
| `` | slotがない状態で提供される場合、コンテンツは名前付きslotの間に配置されます。 |
end | コンテンツは、LTRでは仕切り文字の右側に、RTLでは左側に配置されます。 |
start | コンテンツは、LTRでは仕切り文字の左側に、RTLでは右側に配置されます。 |