دکمه ها

دکمه های پیش فرض
دکمه های وضعیت بوت استرپ
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-primary">دکمه اولیه</button>
<button type="button" class="btn btn-secondary">دکمه ثانویه</button>
<button type="button" class="btn btn-success">دکمه موفق</button>
<button type="button" class="btn btn-info">دکمه اطلاع</button>
<button type="button" class="btn btn-warning">دکمه هشدار</button>
<button type="button" class="btn btn-danger">دکمه خطر</button>
<button type="button" class="btn btn-light">دکمه روشن</button> 
<!-- Cod Box Copy end -->
دکمه فلت
افزودن کلاس .btn-square برای دکمه فلت
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-square btn-primary">دکمه اولیه</button>
<button type="button" class="btn btn-square btn-secondary">دکمه ثانویه</button>
<button type="button" class="btn btn-square btn-success">دکمه موفق</button>
<button type="button" class="btn btn-square btn-info">دکمه اطلاع</button>
<button type="button" class="btn btn-square btn-warning">دکمه هشدار</button>
<button type="button" class="btn btn-square btn-danger">دکمه خطر</button>
<button type="button" class="btn btn-square btn-light">دکمه روشن</button> 
<!-- Cod Box Copy end --> 
دکمه لبه گرد
افزودن کلاس .btn-pill برای دکمه لبه گرد
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-pill btn-primary">دکمه اولیه</button>
<button type="button" class="btn btn-pill btn-secondary">دکمه ثانویه</button>
<button type="button" class="btn btn-pill btn-success">دکمه موفق</button>
<button type="button" class="btn btn-pill btn-info">دکمه اطلاع</button>
<button type="button" class="btn btn-pill btn-warning">دکمه هشدار</button>
<button type="button" class="btn btn-pill btn-danger">دکمه خطر</button>
<button type="button" class="btn btn-pill btn-light">دکمه روشن</button> 
<!-- Cod Box Copy end -->                             
دکمه لبه گرد با سایه
افزودن کلاس های .btn-pill و .btn-air-* برای دکمه لبه گرد با سایه
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-pill btn-primary btn-air-primary">دکمه اولیه</button>
<button type="button" class="btn btn-pill btn-secondary btn-air-secondary">دکمه ثانویه</button>
<button type="button" class="btn btn-pill btn-success btn-air-success">دکمه موفق</button>
<button type="button" class="btn btn-pill btn-info btn-air-info">دکمه اطلاع</button>
<button type="button" class="btn btn-pill btn-warning btn-air-warning">دکمه هشدار</button>
<button type="button" class="btn btn-pill btn-danger btn-air-danger">دکمه خطر</button>
<button type="button" class="btn btn-pill btn-light btn-air-light">دکمه روشن</button>
<!-- Cod Box Copy end -->
دکمه گروهی
دکمه های بزرگ
افزودن کلاس .btn-lg برای دکمه های سایز بزرگ
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-primary btn-lg">دکمه اولیه</button>
<button type="button" class="btn btn-secondary btn-lg">دکمه ثانویه</button>
<button type="button" class="btn btn-success btn-lg">دکمه موفق</button>
<button type="button" class="btn btn-info btn-lg">دکمه اطلاع</button>
<button type="button" class="btn btn-warning btn-lg">دکمه هشدار</button>
<button type="button" class="btn btn-danger btn-lg">دکمه خطر</button>
<button type="button" class="btn btn-light btn-lg">دکمه روشن</button> 
<!-- Cod Box Copy end -->
دکمه های کوچک
افزودن کلاس .btn-sm برای دکمه های سایز کوچک
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-primary btn-sm">دکمه اولیه</button>
<button type="button" class="btn btn-secondary btn-sm">دکمه ثانویه</button>
<button type="button" class="btn btn-success btn-sm">دکمه موفق</button>
<button type="button" class="btn btn-info btn-sm">دکمه اطلاع</button>
<button type="button" class="btn btn-warning btn-sm">دکمه هشدار</button>
<button type="button" class="btn btn-danger btn-sm">دکمه خطر</button>
<button type="button" class="btn btn-light btn-sm">دکمه روشن</button> 
<!-- Cod Box Copy end -->
دکمه های خیلی کوچک
افزودن کلاس .btn-xs برای دکمه های سایز خیلی کوچک
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-primary btn-xs">دکمه اولیه</button>
<button type="button" class="btn btn-secondary btn-xs">دکمه ثانویه</button>
<button type="button" class="btn btn-success btn-xs">دکمه موفق</button>
<button type="button" class="btn btn-info btn-xs">دکمه اطلاع</button>
<button type="button" class="btn btn-warning btn-xs">دکمه هشدار</button>
<button type="button" class="btn btn-danger btn-xs">دکمه خطر</button>
<button type="button" class="btn btn-light btn-xs">دکمه روشن</button> 
<!-- Cod Box Copy end -->
دکمه های فعال
افزودن کلاس .active برای وضعیت فعال
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-primary active">فعال</button>
<button type="button" class="btn btn-secondary active">فعال</button>
<button type="button" class="btn btn-success active">فعال</button>
<button type="button" class="btn btn-info active">فعال</button>
<button type="button" class="btn btn-warning active">فعال</button>
<button type="button" class="btn btn-danger active">فعال</button>
<button type="button" class="btn btn-light active">فعال</button> 
<!-- Cod Box Copy end -->
دکمه های غیرفعال
افزودن کلاس .disabled یا خاصیت disabled="disabled" برای وضعیت غیرفعال
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-primary disabled">غیرفعال</button>
<button type="button" class="btn btn-secondary disabled">غیرفعال</button>
<button type="button" class="btn btn-success disabled">غیرفعال</button>
<button type="button" class="btn btn-info disabled">غیرفعال</button>
<button type="button" class="btn btn-warning disabled">غیرفعال</button>
<button type="button" class="btn btn-danger disabled">غیرفعال</button>
<button type="button" class="btn btn-light disabled">غیرفعال</button> 
<!-- Cod Box Copy end -->
دکمه های اوت لاین
افزودن کلاس .btn-outline-* برای دکمه های مرزی
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-outline-primary">دکمه اولیه</button>
<button type="button" class="btn btn-outline-secondary">دکمه ثانویه</button>
<button type="button" class="btn btn-outline-success">دکمه موفق</button>
<button type="button" class="btn btn-outline-info">دکمه اطلاع</button>
<button type="button" class="btn btn-outline-warning">دکمه هشدار</button>
<button type="button" class="btn btn-outline-danger">دکمه خطر</button>
<button type="button" class="btn btn-outline-light txt-dark">دکمه روشن</button> 
<!-- Cod Box Copy end -->
دکمه های اوت لاین با خط مرز بولد
افزودن کلاس .btn-outline-*-2x برای دکمه های اوت لاین بولد
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-outline-primary-2x">دکمه اولیه</button>
<button type="button" class="btn btn-outline-secondary-2x">دکمه ثانویه</button>
<button type="button" class="btn btn-outline-success-2x">دکمه موفق</button>
<button type="button" class="btn btn-outline-info-2x">دکمه اطلاع</button>
<button type="button" class="btn btn-outline-warning-2x">دکمه هشدار</button>
<button type="button" class="btn btn-outline-danger-2x">دکمه خطر</button>
<button type="button" class="btn btn-outline-light-2x txt-dark">دکمه روشن</button> 
<!-- Cod Box Copy end -->
دکمه های گرادیان
افزودن کلاس .btn-*-gradien برای دکمه های گرادیان
<!-- Cod Box Copy begin -->
<button type="button" class="btn btn-primary-gradien">دکمه اولیه</button>
<button type="button" class="btn btn-secondary-gradien">دکمه ثانویه</button>
<button type="button" class="btn btn-success-gradien">دکمه موفق</button>
<button type="button" class="btn btn-info-gradien">دکمه اطلاع</button>
<button type="button" class="btn btn-warning-gradien">دکمه هشدار</button>
<button type="button" class="btn btn-danger-gradien">دکمه خطر</button> 
<!-- Cod Box Copy end -->