آموزش کار با کامپوننت های Pagination و Dropdown در بوت استرپ 4


آموزش کار با کامپوننت های Pagination و Dropdown در بوت استرپ 4

یادگیری کامپوننت های Pagination و Dropdown در بوت استرپ 4:


در این بخش از آموزش، با کامپوننت‌های Pagination و Dropdown در بوت  استرپ 4 و کلاس‌های آن‌ها آشنا می‌شوید. از pagination برای صفحه بندی اطلاعات سایت استفاده می شود و dropdownها هم منوهای بازشونده هستند.

 

کلاس‌های Pagination:

  • pagination: برای ایجاد pagination، کلاس pagination را به تگ ul اضافه می کنیم.
  • page-item: این کلاس را به تگ li اضافه می کنیم.
  • page-link: این کلاس را به لینک‌های داخل li اضافه می کنیم.
  • disabled and active: از کلاس active برای مشخص کردن صفحه فعال استفاده میشود و برای غیر فعال کردن از کلاس disabled استفاده می شود.
  • sizing (lg - sm): برای نمایش pagination در سایزکوچک از کلاس pagination-sm و در سایز بزرگ از کلاس pagination-lg استفاده می شود.
  • justify-content (start , center , end):  می توان ترازبندی pagination را با کلاس‌های flexbox تغییر داد.

 

کلاس‌های Dropdown:

  • dropdown-toggle: برای باز کردن یک منو بازشونده  از این کلاس و صفت data-toggle=”dropdown” استفاده می شود.
  • dropdown-toggle-split: برای ایجاد دکمه‌های کشویی مجزا استفاده می شود.
  • dropdown-menu: برای ایجاد یک منو باز شونده این کلاس را به تگ ul اضافه می کنیم.
  • dropdown-item: برای آیتم‌های منو بازشونده استفاده می شود.
  • sizing(btn-lg , btn-sm): برای ایجاد دکمه‌های، منو بازشونده در سایزهای مختلف استفاده می شود.
  • dropleft , dropright: برای قرار دادن منو در سمت راست یا چپ صفحه استفاده می شود.
  • dividers: ایجاد یک خط افقی برای جدا کردن لینک‌های منو استفاده می شود.
  • dropdown-header: برای ایجاد هدر یا سر تیتر به منو بازشونده استفاده می شود.
  • active, disabled: برای فعال و غیر فعال کردن لینک‌های منو استفاده می شود.
  • form: می توان یک فرم را در یک منوی بازشونده قرار دهید یا آن را به یک فهرست کشویی تبدیل کنید.

 

برای یادگیری این مبحث مثال‌ها و نکته‌های متعددی را در فایل ویدئویی آورده‌ایم که با تهیه این درس و مشاهده ویدئوها به طور کامل به این مبحث مسلط خواهید شد.

 

امیدواریم که این آموزش، برای شما دوستان درسمنی عزیز مفید باشد،درصورت سوال و یا مشکل می‌توانید به انجمن پرسش و پاسخ درسمن مراجعه کنید. پیشنهادات و انتقادات خود را در بخش نظرات برای ما ارسال کنید.smiley

انجمن برنامه نویسان وب

 


نظر بدهید نظر شما در تصمیم دیگران اثرگذار است. لطفا برای ما و همراهان درسمن نظر خود را بنویسید.
برای ارسال نظر نیاز است وارد سایت شوید. در صورت نداشتن حساب کاربری عضو شوید.


مشخصات دوره


مدرس دوره : مهدی عباسی
تعداد جلسات : جلسه
مدت زمان : 661 دقیقه
حجم دوره : 2/78 گیگابایت
سطح مهارت : مقدماتی تا پیشرفته
وضعیت دوره : پایان یافته
تعداد دانشجویان : 1536
: میانگین امتیاز
برای دسترسی به این دوره وارد یا عضو شوید.
مهدی عباسی

مهدی عباسی هستم، مسلط به حداقل ۲۰ زبان مطرح برنامه نویسی به صورت پیشرفته، مدیر عامل شرکت آریا نرم افزار و بنیانگذار آکادمی درسمن، مسلط به تدریس دروس تخصصی کاردانی و کارشناسی کامپیوتر، پایگاه داده ها، برنامه نویسی پیشرفته، مبانی برنامه نویسی، مباحث ویژه طراحی وب و ....