دکمه های پیش فرض
بوت استرپ شامل شش سبک دکمه از پیش تعریف شده است که هر کدام هدف معنایی خود را انجام می دهند.
دکمه های طرح کلی
کلاس های اصلاح کننده پیش فرض را با the جایگزین کنید.btn-outline-* ones to remove all background images and colors on any
button.
دکمه های گرد
از کلاس استفاده کنید.btn-rounded for button round border.
دکمه ها با نماد
دکمه اضافه کردن نماد در
دکمه های نرم
دکمه های نرم
دکمه های آیکون نرم
از کلاس استفاده کنیدbtn-soft-* for button round border.
غیرفعال کردن دکمه ها
با اضافه کردن دکمه، دکمه‌ها را غیرفعال کنیدdisabled boolean attribute to any <button> element. Disabled buttons have pointer-events: none applied to, preventing hover and active states from triggering.
دکمه های غیرفعال کردن هشدار عملکرد پیوند
<a>s don’t support the disabled attribute, so you must add the .disabled class and aria-disabled="true" to make it visually appear disabled. also include a tabindex="-1" attribute.
دکمه های برش
نمونه ای از دکمه های Snip
مثال 1
مثال 2
مثال 3
اندازه دکمه ها
اضافه کردن.btn-lg or .btn-sm for additional sizes.
عرض دکمه ها
اضافه کردن.w-xs, .w-sm, .w-md and .w-lg class for additional buttons width.
برچسب های دکمه
را.btn
classes are designed to be used with the <button> element.
However, you can also use these classes on <a> or <input> elements (though
some browsers may apply a slightly different rendering).
تغییر وضعیت ها
اضافه کردنdata-bs-toggle="button" to toggle a button’s active state. If you’re pre-toggling a button, you must manually add the .active class و aria-pressed="true" to ensure that it is conveyed appropriately to assistive technologies.
دکمه های بلوک
اضافه کردن.d-grid. class in parent div for block buttons
چک باکس و دکمه های رادیویی
با استفاده از چک باکس های دکمه مانند و دکمه های رادیویی ایجاد کنید.btn styles rather than
.form-check-label on the <label> elements.
گروه دکمه
یک سری دکمه را با آن بپیچید.btn in .btn-group.
نوار ابزار دکمه
مجموعه ای از گروه های دکمه را با هم ترکیب کنید
سایز بندی
به جای اعمال اندازه دکمه .btn-group-* to each .btn-group, including each one
when nesting multiple groups.
تنوع عمودی
مجموعه ای از دکمه ها را به صورت عمودی نشان دهید