メインコンテンツまでスキップ
バージョン: v8

ion-list-header

shadow

リストヘッダーは、リストの内容を記述するために使用されるブロック要素です。アイテムディバイダー](./item-divider)とは異なり、リストヘッダーはアイテムのリストの先頭で一度だけ使用する必要があります。

基本的な使い方​

リストヘッダーのボタン​

リストのヘッダーに button を配置すると、リストの一部を表示し、ボタンで全リストにリダイレクトするのに便利です。

List Headerの下線​

リストヘッダーは、デフォルトでは下部のボーダーが表示されません。 lines プロパティを "full" または "inset" に変更すると、それぞれ全幅のボーダーまたは左paddingを伴う挿入ボーダーが表示されます。

テーマ​

Colors​

CSSカスタムプロパティ​

プロパティ​

color​

DescriptionThe 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.
Attributecolor
Type"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string | undefined
Defaultundefined

lines​

DescriptionHow the bottom border should be displayed on the list header.
Attributelines
Type"full" | "inset" | "none" | undefined
Defaultundefined

mode​

DescriptionThe mode determines which platform styles to use.
Attributemode
Type"ios" | "md"
Defaultundefined

イベント​

No events available for this component.

メソッド​

No public methods available for this component.

CSS Shadow Parts​

No CSS shadow parts available for this component.

CSSカスタムプロパティ​

NameDescription
--backgroundBackground of the list header
--border-colorColor of the list header border
--border-styleStyle of the list header border
--border-widthWidth of the list header border
--colorColor of the list header text
--inner-border-widthWidth of the inner list header border

Slots​

No slots available for this component.