Divide Width

Tetapkan lebar pemisah

Sintaks

visual="divide-w:[value]" | visual="divide-{x|y}-w:[value]"

Nilai

Nilai	CSS Output	Huraian
none	border-width: var(--s-none)	Tiada pemisah (0px)
thin	border-width: var(--s-thin)	Pemisah nipis (1px)
regular	border-width: var(--s-regular)	Pemisah standard (2px)
thick	border-width: var(--s-thick)	Pemisah tebal (3px)

Contoh

<div visual="divide:gray-300 divide-w:thin">
<div visual="divide:gray-300 divide-w:regular">
<div visual="divide:gray-300 divide-w:thick">
<div visual="divide-y:primary divide-y-w:regular">
<div visual="divide-x:primary divide-x-w:thin">

Pratonton

Lebar Pemisah

visual="divide-w:regular" - Pilihan lebar pemisah berbeza

thin (1px)

thin (1px)

thin (1px)

regular (2px)

regular (2px)

regular (2px)

thick (3px)

thick (3px)

thick (3px)

Lihat Kod

<div layout="flex col" space="p:medium g:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <div layout="flex" visual="bg:white dark:bg:neutral-800 rounded:small divide:neutral-500 divide-x-w:thin">
    <div space="p:medium">thin (1px)</div>
    <div space="p:medium">thin (1px)</div>
    <div space="p:medium">thin (1px)</div>
  </div>
  <div layout="flex" visual="bg:white dark:bg:neutral-800 rounded:small divide:neutral-500 divide-x-w:regular">
    <div space="p:medium">regular (2px)</div>
    <div space="p:medium">regular (2px)</div>
    <div space="p:medium">regular (2px)</div>
  </div>
  <div layout="flex" visual="bg:white dark:bg:neutral-800 rounded:small divide:neutral-500 divide-x-w:thick">
    <div space="p:medium">thick (3px)</div>
    <div space="p:medium">thick (3px)</div>
    <div space="p:medium">thick (3px)</div>
  </div>
</div>

Nilai Arbitrari

Sokong nilai tersuai menggunakan sintaks kurungan segi empat:

<div visual="divide:[custom-value]">Custom</div>