DividerAyırıcı

Ayırıcı, listeler ve konteynırlar içindeki içeriği gruplandırmak için kullanılan ince bir çizgidir.

Kullanım Şekli

Bileşeni ihtiyacınıza göre içe aktarın:

import 'mdui/components/divider.js';

Bileşenin TypeScript türünü ihtiyacınıza göre içe aktarın:

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

Kullanım örneği:

<mdui-divider></mdui-divider>

vertical özniteliğini ekleyin, ayırıcı dikey olarak görüntülenecektir.

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

Kaynak Kodu

inset özniteliğini ekleyin, ayırıcı soldan girintili olacaktır. Bu genellikle, ayırıcıyı listedeki sol metinle hizalamak için kullanılır.

Öğe 1

Öğe 2

<mdui-list>
  <mdui-list-item>Öğe 1</mdui-list-item>
  <mdui-divider inset></mdui-divider>
  <mdui-list-item>Öğe 2</mdui-list-item>
</mdui-list>

Kaynak Kodu

middle özniteliğini ekleyin, ayırıcı her iki taraftan girintili olacaktır.

Öğe 1

Öğe 2

<mdui-list>
  <mdui-list-item>Öğe 1</mdui-list-item>
  <mdui-divider middle></mdui-divider>
  <mdui-list-item>Öğe 2</mdui-list-item>
</mdui-list>

Kaynak Kodu

Öznitelik	Özellik	Tür	Varsayılan
`vertical`	`vertical`	`boolean`	`false`
Dikey ayırıcı çizgi olup olmadığı.
`inset`	`inset`	`boolean`	`false`
Sol taraftan girinti yapılıp yapılmayacağı.
`middle`	`middle`	`boolean`	`false`
Her iki taraftan da girinti yapılıp yapılmayacağı.

Önceki Bölüm

Dialog Diyalog

Sonraki Bölüm

Dropdown Açılır Menü