چطور میشه در Bootstrap فاصله بالای بین ردیفها رو اضافه کرد؟
How to add top space between rows in Bootstrap?
من از فریمورک Bootstrap استفاده میکنم و قصد دارم بین ردیفها (rows) در یک container فاصله ایجاد کنم. بهطور پیشفرض، ردیفها چسبیده به هم نمایش داده میشن چطور میتونم این فاصله رو اضافه کنم؟
برای اضافه کردن فاصله بین ردیفها در Bootstrap، بهترین و ساده ترین راه استفاده از کلاسهای فضای داخلی (padding) یا فضای بیرونی (margin) هستش. در Bootstrap 5، میتونی از کلاسهای mt-*
برای ایجاد فاصله بالا (margin-top) استفاده کنی فرض کنیم که دو ردیف در یک container داریم و میخوایم بین اونا فاصله بیندازید.باید به ردیف دوم کلاس mt-3
یا mt-4
بدیم تا فاصله مناسب ایجاد بشه
<div class="container"> <div class="row"> محتوای ردیف اول </div> <div class="row mt-4"> محتوای ردیف دوم </div> </div>
تو این مثال، کلاس mt-4
به ردیف دوم اضافه شده که باعث میشه فاصله ای از بالا برای اون ردیف ایجاد بشه اگر بخوایم فاصله دقیقتری رو تنظیم کنیم، میتونیم از کلاسهای دیگه مثل mt-1
تا mt-5
(برای فاصلههای مختلف) یا mt-auto
برای حداکثر فاصله ممکن استفاده کنیم