Back to Element Plus

Divider

docs/en-US/component/divider.md

2.13.71.7 KB
Original Source

Divider

The dividing line that separates the content.

Basic usage

Divide the text of different paragraphs.

:::demo

divider/basic-usage

:::

Custom content

You can customize the content on the divider line.

:::demo

divider/custom-content

:::

dashed line

You can set the style of divider.

:::demo

divider/line-dashed

:::

Vertical divider

:::demo

divider/vertical-divider

:::

API

Attributes

NameDescriptionTypeDefault
directionSet divider's direction^[enum]'horizontal' | 'vertical'horizontal
border-styleSet the style of divider^[enum]'none' | 'solid' | 'hidden' | 'dashed' | ... css/border-stylesolid
content-positionThe position of the customized content on the divider line^[enum]'left' | 'right' | 'center'center

Slots

NameDescription
defaultCustomized content on the divider line