উল্লম্ব নিয়ম

<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>