mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
63 lines
1.8 KiB
Markdown
63 lines
1.8 KiB
Markdown
---
|
|
title: Divider
|
|
lang: en-US
|
|
---
|
|
|
|
# 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
|
|
|
|
| Name | Description | Type | Default |
|
|
| ---------------- | ---------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | ---------- |
|
|
| direction | Set divider's direction | ^[enum]`'horizontal' \| 'vertical'` | horizontal |
|
|
| border-style | Set the style of divider | ^[enum]`'none' \| 'solid' \| 'hidden' \| 'dashed' \| ...` [css/border-style](https://developer.mozilla.org/zh-CN/docs/Web/CSS/border-style) | solid |
|
|
| content-position | the position of the customized content on the divider line | ^[enum]`'left' \| 'right' \| 'center' ` | center |
|
|
|
|
### Slots
|
|
|
|
| Name | Description |
|
|
| ------- | -------------------------------------- |
|
|
| default | customized content on the divider line |
|