mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-25 16:58:00 +08:00
218e1cea3d
The divider border style can be either solid, dashed or dotted based on the variant props. The default value is solid. Signed-off-by: Pinaki Raj <pinakiraj15@gmail.com>
2.0 KiB
2.0 KiB
category | title | description | cover | coverDark | demo | group | ||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Components | Divider | A divider line separates different content. | https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*7sMiTbzvaDoAAAAAAAAAAAAADrJ8AQ/original | https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*KPSEQ74PLg4AAAAAAAAAAAAADrJ8AQ/original |
|
|
When To Use
- Divide sections of an article.
- Divide inline text and links such as the operation column of table.
Examples
Horizontal
Divider with title
Text without heading style
Vertical
Style Customization
Component Token
Variant
API
Common props ref:Common props
Property | Description | Type | Default | Version |
---|---|---|---|---|
children | The wrapped title | ReactNode | - | |
className | The className of container | string | - | |
dashed | Whether line is dashed | boolean | false | |
variant | Whether line is dashed, dotted or solid | dashed | dotted | solid |
solid | |
orientation | The position of title inside divider | left | right | center |
center |
|
orientationMargin | The margin-left/right between the title and its closest border, while the orientation must be left or right , If a numeric value of type string is provided without a unit, it is assumed to be in pixels (px) by default. |
string | number | - | |
plain | Divider text show as plain style | boolean | true | 4.2.0 |
style | The style object of container | CSSProperties | - | |
type | The direction type of divider | horizontal | vertical |
horizontal |