سرفصل دوره
آموزش کار با کامپوننت های 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: می توان یک فرم را در یک منوی بازشونده قرار دهید یا آن را به یک فهرست کشویی تبدیل کنید.
برای یادگیری این مبحث مثال‌ها و نکته‌های متعددی را در فایل ویدئویی آورده‌ایم که با تهیه این درس و مشاهده ویدئوها به طور کامل به این مبحث مسلط خواهید شد.
امیدواریم که این آموزش، برای شما دوستان درسمنی عزیز مفید باشد،درصورت سوال و یا مشکل می‌توانید به انجمن پرسش و پاسخ درسمن مراجعه کنید. پیشنهادات و انتقادات خود را در بخش نظرات برای ما ارسال کنید.
انجمن برنامه نویسان وب
آموزش کار با کامپوننت های 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: می توان یک فرم را در یک منوی بازشونده قرار دهید یا آن را به یک فهرست کشویی تبدیل کنید.
برای یادگیری این مبحث مثال‌ها و نکته‌های متعددی را در فایل ویدئویی آورده‌ایم که با تهیه این درس و مشاهده ویدئوها به طور کامل به این مبحث مسلط خواهید شد.
امیدواریم که این آموزش، برای شما دوستان درسمنی عزیز مفید باشد،درصورت سوال و یا مشکل می‌توانید به انجمن پرسش و پاسخ درسمن مراجعه کنید. پیشنهادات و انتقادات خود را در بخش نظرات برای ما ارسال کنید.
انجمن برنامه نویسان وب