gif
از دست ندهید! به‌روزرسانی جدید منتشر شده است.
gif
چیزی که دوست دارید اکنون در فروش است!
هم اکنون بخرید!

اجزای جدول

  2. جداول بوت استرپ
  3. اجزای جدول

UI Components

دکمه Bootstrap شامل شش سبک دکمه از پیش تعریف شده است که هر کدام هدف معنایی خود را انجام می دهند.
دکمه های گرد از کلاس .btn-pill برای دکمه زدن دکمه های گرد استفاده کنید.
دکمه های کشویی
سرصفحه کشویی
عملیاتیک اقدام دیگرکار دیگری در اینجا
پیوند جدا
از کلاس .dropdown-toggle برای دکمه Dropdown-toggle استفاده کنید.
گروه دکمه اصلی
از کلاس btn-group برای دکمه div استفاده کنید.
دکمه های دارای نماد Bootstrap شامل شش سبک دکمه از پیش تعریف شده است که هر کدام هدف معنایی خود را انجام می دهند.
دکمه نماد دکمه نماد ساده
دکمه های بارگیری بسط دکمه های انیمیشن

Alerts

هشدار اولیه

موفقیت! نشان دهنده یک اقدام موفق یا مثبت است.

هشدارها برای هر طول متن و همچنین یک دکمه رد اختیاری در دسترس هستند. برای هشدار با همه رنگ های طرح زمینه.
هشدارها با پیوندها

موفق بود! باید این پیام را بخوانید.

هشدارها برای هر طول متن و همچنین یک دکمه رد اختیاری در دسترس هستند. برای هشدار با همه رنگ های طرح زمینه.
هشدارهای غیرقابل قبول یک دکمه رد کردن و کلاس alert alert-dismissable اضافه کنید، که بالشتک اضافی را در سمت راست هشدار اضافه می کند و پیوند بستنa را در دکمه رد کردن، ویژگی data-bs-dismiss="alert" را اضافه کنید، که عملکرد جاوا اسکریپت را فعال می کند. حتماً از عنصر a برای رفتار مناسب در همه دستگاه‌ها استفاده کنید. برای متحرک کردن هشدارها هنگام رد کردن آنها، حتماً کلاس‌های .fade و .in را اضافه کنید.
هشدارها با نمادها یک دکمه رد کردن و کلاس alert alert-dismissable اضافه کنید، که بالشتک اضافی را در سمت راست هشدار اضافه می کند و پیوند بستنa را در دکمه رد کردن، ویژگی data-bs-dismiss="alert" را اضافه کنید، که عملکرد جاوا اسکریپت را فعال می کند. حتماً از عنصر a برای رفتار مناسب در همه دستگاه‌ها استفاده کنید. برای متحرک کردن هشدارها هنگام رد کردن آنها، حتماً کلاس‌های .fade و .in را اضافه کنید.

Progressbar

پیشرفت پیش فرض
از نوار پیشرفت با classprogress-bar و رنگ پس زمینهbg-primary, bg-secondaryهمچنین تغییر استفاده می کند
پیشرفت راه راه
از یک گرادیان برای ایجاد کلاس جلوه راه راه استفاده می کند.progress-bar-striped
اندازه های پیشرفت
پیشرفت در اندازه های مختلف. برای پیشرفت پیش‌فرض، کلاس به lg-progress-barدر بخش نیاز دارد.

Checkbox

چک باکس اصلی چک باکس اساسی
چک باکس پیش فرض
با کادر انتخاب .m-squar بپیچید.
بررسی اولیه پوست
با استفاده ازcheckbox-darkبرای این سبک از کادر انتخاب بپیچید.
بررسی پوست صاف
با استفاده ازcheckbox-solid-*،اولیه، ثانویه، موفقیت، اطلاعات، هشدار، خطربرای این سبک از چک باکس استفاده کنید.
غیرفعال کردن چک
با استفاده ازغیرفعال،اولیه، ثانویه، موفقیت، اطلاعات، هشدار، خطربرای این سبک از چک باکس غیرفعال کنید.
چک باکس درون خطی
با استفاده ازغیرفعال،اولیه، ثانویه، موفقیت، اطلاعات، هشدار، خطربرای این سبک از چک باکس غیرفعال کنید.

Radio Buttons

دکمه های رادیویی اصلی دکمه های رادیویی اصلی
رادیو پیش فرض
با استفاده از .radio-* و رنگ .radio-*اصلی، ثانویه، موفقیت، اطلاعات در رادیو بپیچید.
رادیو بررسی شده
با استفاده ازcheckbox-darkبرای این سبک از کادر انتخاب بپیچید.
بررسی پوست صاف
با استفاده ازcheckbox-solid-*،اولیه، ثانویه، موفقیت، اطلاعات، هشدار، خطربرای این سبک از چک باکس استفاده کنید.
چک باکس درون خطی
با استفاده ازغیرفعال،اصلی، ثانویه، موفقیت، اطلاعات، هشدار، خطر، روشن، تاریکبرای این سبک از چک باکس غیرفعال کنید.

Select

انتخاب تک برای کنترل اصلی انتخاب استفاده کنید.
حالت انتخاب غیرفعال استفاده برای غیرفعال کردن کنترل انتخاب اضافه غیرفعال.
حالت انتخاب بزرگ استفاده برای کنترل انتخاب بزرگ و کوچک افزودن کلاسform-control-*lg، sm.
نمونه انتخاب چندگانه برای کنترل چند انتخابی از کد اضافه کنید چنددر انتخاب استفاده کنید.

Input

استفاده کنید
متن ورودی پیش فرض برای کنترل اصلی انتخاب استفاده کنید.
رنگ شناور ورودی استفاده از رنگ ورودی پایه، کلاسinput-air-*اصلی، ثانویه، موفقیت، اطلاعات.در ورودی

Badges

استفاده کنید
قرص های اساسی اصلی از کلاس .badge و به دنبال آن استفاده کنید. با رنگ نشان از کلاس .badge-*اولیه، ثانویه، موفقیت، اطلاعات، هشدار، خطر، نور در داخل عنصر برای ایجاد قرص پیش‌فرض استفاده کنید.
برچسب با نماد
برچسب اصلی
از کلاس label-square با div

Tooltip Triggers

محرک از data-bs-toggle="tooltip" برای ماشه شناور استفاده کنید. این یک راه‌انداز پیش‌فرض است
لینک لینک از a href="#" برای راه‌اندازی پیوند استفاده کنید. این یک راه‌انداز پیوند است
دکمه طرح کلی از btn btn-outline-info برای راه اندازی طرح کلی استفاده کنید. و دکمه پررنگ حاشیه استفاده کنید classbtn btn-outline-dark-2x

Switch

سوئیچ پیش فرض از کلاس سوئیچ برای برچسب استفاده کنید.
غیرفعال کردن سوئیچ این غیرفعال کردن سوئیچ غیرفعال
تغییر رنگ
از کلاس bg-*اصلی , ثانویه , موفقیت , اطلاعات , هشدار , خطر در بازه با نماد نمایش سوئیچ icon-stateدر بخش.
تغییر Outline
از کلاس switch-outlineدر div استفاده کنید.