አቀባዊ ደንብ

<hr>እንደ ኤለመንት ያሉ ቀጥ ያሉ አካፋዮችን ለመፍጠር ብጁ የቋሚ ደንብ ረዳትን ይጠቀሙ ።

በዚህ ገጽ ላይ

እንዴት እንደሚሰራ

አቀባዊ ደንቦች በንጥሉ ተመስጧዊ ናቸው <hr>, ይህም በጋራ አቀማመጦች ውስጥ ቀጥ ያሉ ክፍሎችን ለመፍጠር ያስችልዎታል. እነሱ ልክ እንደ <hr>ንጥረ ነገሮች ተዘጋጅተዋል፦

1pxሰፊ ናቸው።
አላቸው min-height_1em
ቀለማቸው በ currentColorእናopacity

እንደ አስፈላጊነቱ ከተጨማሪ ቅጦች ጋር አብጅዋቸው።

ለምሳሌ

html

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

አቀባዊ ደንቦች ቁመታቸውን በተለዋዋጭ አቀማመጦች ይለካሉ፡

html

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

ከቁልል ጋር

እንዲሁም በጥቅሎች ውስጥ ጥቅም ላይ ሊውሉ ይችላሉ-

የመጀመሪያው ንጥል

ሁለተኛ ንጥል

ሦስተኛው ንጥል

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>