跳到主要内容
版本:v7

ion-list-header

shadow

列表头部(List headers)是用于描述列表(list)内容的块级元素。与项目分隔符(item dividers)不同,列表头部应当仅出现在项目(items)列表的顶部一次。

基本用法

列表头部中的按钮

在列表头部放置按钮(button)有助于显示列表的一部分内容,并通过按钮引导用户查看完整列表。

列表头部线条

默认情况下,列表头部不显示底部边框。通过将 lines 属性修改为 "full""inset",可以分别显示全宽边框或带有左侧内边距的嵌入边框。

主题定制

颜色

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.

This is a virtual property that is set once during initialization and will not update if you change its value after the initial render.
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

插槽

No slots available for this component.