ایجاد شده در ۲۵ شهریور ۱۴۰۴
جلسه ششم – سیستم گرید بخش چهارم – Column Ordering و Offset
🔹 بررسی کلاس order
- بوت‌استرپ این امکان رو می‌ده که ترتیب ستون‌ها در سیستم گرید رو تغییر بدیم.
- با استفاده از کلاس‌های order-* می‌تونیم کنترل کنیم که هر ستون در چه جایگاهی نمایش داده بشه.
- مقدار * می‌تونه عددی بین 1 تا 12 باشه (همچنین order-first و order-last هم داریم).
- کاربرد: وقتی در موبایل یا دسکتاپ می‌خوایم ترتیب چینش آیتم‌ها متفاوت باشه.
🔹 بررسی کلاس offset
- با استفاده از offset-* می‌تونیم ستون‌ها رو به اندازه مشخصی به سمت راست جابه‌جا کنیم.
- مقدار * مشخص می‌کنه چند ستون فضای خالی قبل از ستون ایجاد بشه.
- کاربرد: برای ایجاد فاصله یا وسط‌چین کردن محتوا در سیستم گرید.
🔹 کنترل order و offset در مدیا کوئری‌ها
- بوت‌استرپ مثل سایر بخش‌های گرید، برای order و offset هم کلاس‌های واکنش‌گرا داره.
- مثال:
- order-sm-2 یعنی در سایز کوچک (sm) ستون دوم باشه.
- offset-lg-3 یعنی در سایز بزرگ (lg) ستون سه واحد به سمت راست فاصله داشته باشه.
- این قابلیت باعث می‌شه طراحی ریسپانسیو انعطاف‌پذیرتر بشه.