Bootstrap's الإعدادات الافتراضية
ضوابط شكل فردية تحصل تلقائيا على بعض التصميم العالمي مع Bootstrap .
جميع النصوص <input>, <textarea> و <select> العناصر مع class="form-control" يتم تعيين لعرض: 100٪؛ بشكل افتراضي.
قواعد موحدة ل Bootstrap أشكال:
- إضافة role="form" ل <form> عنصر (يساعد على تحسين إمكانية الوصول للأشخاص الذين يستخدمون قارئات الشاشة)
- التفاف التسميات وضوابط النموذج في <div> العنصر مع class="form-group" (اللازمة لتباعد الأمثل)
- إضافة class="form-control" لجميع النصوص <input>, <textarea> و <select> عناصر
يقوم المثال التالي بإنشاء نموذج التمهيد بسيط مع اثنين من حقول الإدخال، مربع واحد، ويقدم الزر:
التمهيد نموذج مثال
<form role="form">
<div class="form-group">
<label for="email">Email address:</label>
<input
type="email" class="form-control" id="email">
</div>
<div class="form-group">
<label
for="pwd">Password:</label>
<input type="password"
class="form-control" id="pwd">
</div>
<div class="checkbox">
<label><input type="checkbox">
Remember me</label>
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form> انها محاولة لنفسك » <form> فصول
| صف مدرسي | وصف | مثال |
|---|---|---|
| .form-inline | يجعل <form> مع الضوابط مضمنة كتلة (وهذا لا ينطبق إلا على أشكال في محاذاة اليسار viewports التي 768px على الأقل واسعة) | جربها |
| .form-horizontal | محاذاة التسميات ومجموعات من عناصر تحكم النموذج في تخطيط أفقي | جربها |