Vertikali taisyklė

Naudokite tinkintą vertikalių taisyklių pagalbinę priemonę, kad sukurtumėte vertikalius skirstytuvus, tokius kaip <hr>elementas.

Šiame puslapyje

Kaip tai veikia

Vertikalios taisyklės įkvėptos <hr>elemento, leidžiančios sukurti vertikalius skirstytuvus bendruose išdėstymuose. Jie sukurti kaip <hr>elementai:

Jie 1pxplatūs
Jie min-heightturi1em
Jų spalva nustatoma per currentColoriropacity

Prireikus tinkinkite juos naudodami papildomus stilius.

Pavyzdys

html

<div class="vr"></div>

Vertikalios taisyklės nustato jų aukščio mastelį lanksčiame išdėstyme:

html

<div class="d-flex" style="height: 200px;">
  <div class="vr"></div>
</div>

Su rietuvėmis

Jie taip pat gali būti naudojami krūvose :

Pirmas daiktas

Antras elementas

Trečias daiktas

html

<div class="hstack gap-3">
  <div class="bg-light border">First item</div>
  <div class="bg-light border ms-auto">Second item</div>
  <div class="vr"></div>
  <div class="bg-light border">Third item</div>
</div>