DividerOddělovač

Oddělovač je tenká čára používaná k seskupování obsahu v seznamech a kontejnerech.

Způsob použití

Importujte komponentu podle potřeby:

import 'mdui/components/divider.js';

Importujte TypeScript typy komponenty podle potřeby:

import type { Divider } from 'mdui/components/divider.js';

Příklad použití:

<mdui-divider></mdui-divider>

Příklady

Vertikální oddělovač

Přidejte atribut vertical pro vertikální zobrazení oddělovače.

<div style="height: 80px;padding: 0 20px">
  <mdui-divider vertical></mdui-divider>
</div>

Zdrojový kód

Odsazení zleva

Přidejte atribut inset pro odsazení oddělovače zleva. To se často používá v seznamech pro zarovnání oddělovače s levým textem.

Položka 1

Položka 2

<mdui-list>
  <mdui-list-item>Položka 1</mdui-list-item>
  <mdui-divider inset></mdui-divider>
  <mdui-list-item>Položka 2</mdui-list-item>
</mdui-list>

Zdrojový kód

Odsazení z obou stran

Přidejte atribut middle pro odsazení oddělovače z obou stran.

Položka 1

Položka 2

<mdui-list>
  <mdui-list-item>Položka 1</mdui-list-item>
  <mdui-divider middle></mdui-divider>
  <mdui-list-item>Položka 2</mdui-list-item>
</mdui-list>

Zdrojový kód

API

Vlastnosti

Atribut	Vlastnost	Typ	Výchozí
`vertical`	`vertical`	`boolean`	`false`
Určuje, zda se jedná o vertikální oddělovač.
`inset`	`inset`	`boolean`	`false`
Určuje, zda má být odsazen zleva.
`middle`	`middle`	`boolean`	`false`
Určuje, zda má být odsazen zleva i zprava.

Předchozí kapitola

Dialog Dialog

Další kapitola

Dropdown Rozbalovací nabídka