آموزش متنی مقدماتی تا متوسطه بوت استرپ به زبان فارسی جلسه نهمReviewed by صابر بوستانی on Apr 29Rating: 5.0آموزش متنی مقدماتی تا متوسطه بوت استرپ به زبان فارسیآموزش متنی مقدماتی تا متوسطه بوت استرپ به زبان فارسی جلسه نهم
آموزش متنی مقدماتی تا متوسطه بوت استرپ به زبان فارسی جلسه نهم

آموزش متنی مقدماتی تا متوسطه بوت استرپ به زبان فارسی جلسه نهم

سلام خدمت دوستان عزیز، توی این مطلب درخدمتتون هستیم با آموزش متنی مقدماتی تا متوسطه بوت استرپ به زبان فارسی جلسه نهم که از وب سایت آموزش برنامه نویسی سورس باران مشاهده می نمایید. همونطور که گفته شده این دوره بصورت متنی می باشد و از منابع خارجی ترجمه شده که به صورت متنی در ادامه مطلب ارائه می شود. دوستان عزیز در این جلسه با صفحه بندی و پیجر در بوت استرپ آشنا خواهید شد.

 

 

آموزش ایجاد صفحه بندی در بوت استرپ :

 

صفحه بندی پایه :

اگر وبسایتی با صفحات زیاد دارید ممکن است مایل باشید تا تنظیماتی به روی صفحه ها اعمال کنید. یک صفحه بندی پایه در بوت استرپ به شکل زیر است :

1

برای ایجاد یک صفحه بندی ساده  کلاس .pagination  را به عنصر <ul>  اضافه کنید :

وضعیت فعال صفحه بندی در بوت استرپ : وضعیت فعال صفحه جاری را نشان میدهد. برای اینکه به کاربر نشان دهید درحال حاضر در چه صفحه ای قرار دارد ، باید کلاس .active را اضافه کنید.

جهت مشاهده دمو کلیک نمایید.

وضعیت غیر فعال صفحه بندی در بوت استرپ : نمیتوان بر روی یک لینک یا شماره صفحه غیر فعال کلیک کرد، مانند تصویر زیر :

3

اگر یک لینک به هر دلیلی غیرفعال است ، کلاس .disabled را اضافه کنید :

 

 

اندازه های صفحه بندی در بوت استرپ :

جعبه (بلوک) های صفحه بندی را میشود به اندازه های مختلف در اورد :

4برای بلوک های بزرگتر از کلاس .pagination-lg و برای بلوک های کوچکتر از  کلاس .pagination-sm  استفاده کنید :

 

 

آموزش پیجر بوت استرپ :

پیجر چیست : پیجر نیز نوعی صفحه بندی ست که در بخش قبل توضیح داده شد . پیجر گزینه های قبلی (previous) و بعدی (Next) (لینک) را در اختیار مان قرار میدهد

5

برای ساخت دکمه های قبلی و بعدی کلاس .pager را بع عنصر <ul> اضافه کنید :

 

تراز بندی دکمه ها در بوت استرپ :

برای تراز بندی کردن  دکمه ها به کناره های صفحه از کلاس .previous و .next استفاده کنید :

 

6

برای تازه شدن دیر نیست.

موفق و پیروز باشید