انتقل إلى محتوى الدرس

BootStrap Block Buttons الازرار ذات العرض الكامل في bootstrap

ستتعلم في هذا الدرس تصميم buttons ازرار بسهوله جداً وتخصيص borders اطارات لها والتحكم في حالتها وحجمها عن طريق كلاسات button الموجودة في اطار عمل bootstrap.

1 صفوف تعليمية
Bootstrap
3,534 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي
  • كلاس btn-block هو احد كلاسات bootstrap buttons والذي يسمح للزر بان ياخذ كل عرض parent element العنصر الاب الذي هو بداخله.
  • في حالة وجود عدة ازار فيمكن تخصيص المسافة الراسية بينهم باضافة كلاس *-gap الى parent element.
  • يمكن اضافة كلاس d-grid الى parent element للتاكد بان هذا الاب يتم عرضه في نظام grid شبكة.

Block Button

اعطاء الازرار عرض parent element بالكامل باستخدام كلاس btn-block.

HTML
<button type="button" class="btn btn-primary btn-block">Full-Width Button</button>