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

BootStrap Input Groups مجموعات الادخال في bootstrap

ستتعلم في هذا الدرس التحكم في تنسيقات form inputs عناصر الادخال في الاستمارة عن طريق bootstrap.

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

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

الصف 1 شرح توضيحي
  • تستخدم خاصية input group في bootstrap لاضافة عنصر مثل نص او ايقونة او زرار في بداية او نهاية عنصر <input>.
  • لعمل input group يتم انشاء container حاوية داخل <form> مع كلاس input-group.
  • داخل الحاوية يتم انشاء عنصر <input> وعنصر اخر يحتوي على العنصر الذي تريد اضافته قبل او بعد عنصر <input> وهذا العنصر يوضع له كلاس input-group-text.

Input Group

اضافة نص وصورة وزر لعنصر <input>.

HTML
<div class="input-group">
   <span class="input-group-text">@</span>
   <input type="text" class="form-control" placeholder="Username">
</div>