عناصر اساسی
انواع ورودی
رایج ترین کنترل فرم، فیلدهای ورودی مبتنی بر متن. شامل پشتیبانی از همه انواع HTML5 است: text, کلمه عبور, datetime, datetime-local, تاریخ, month, time, week, number, ایمیل, url, جستجو, telو color.
منو را انتخاب کنید
منوهای سفارشی <select>فقط به یک کلاس سفارشی نیاز دارند .form-selectتا سبک های سفارشی را فعال کنند.
سوئیچ ها
یک سوئیچ دارای نشانه گذاری یک چک باکس سفارشی است اما از .form-switchکلاس برای ارائه یک سوئیچ تعویض استفاده می کند. سوئیچ ها نیز از این disabledویژگی پشتیبانی می کنند.
چک باکس ها و رادیوها
برچسب های شناور
برای فعال کردن برچسبهای شناور با فیلدهای فرم متنی Bootstrap،
یک جفت از <input class="form-control">و <label>عناصر را بپیچید. .form-floatingA placeholderبرای هر یک مورد نیاز است <input>زیرا روش ما برای برچسبهای شناور فقط CSS از :placeholder-shownشبه عنصر استفاده میکند. همچنین توجه داشته باشید که <input>باید اول باشد تا بتوانیم از یک انتخابگر خواهر و برادر استفاده کنیم (مثلاً ~).
مثال شناور
انتخاب می کند
اندازه های ورودی
ارتفاع را با استفاده از کلاس هایی مانند .input-lgتنظیم کنید و عرض ها را با استفاده از کلاس های ستون شبکه مانند تنظیم .col-lg-*کنید.
گروه ورودی
با افزودن متن، دکمهها یا گروههای دکمه در دو طرف ورودیهای متنی، انتخابهای سفارشی و ورودیهای فایل سفارشی، کنترلهای فرم را به راحتی گسترش دهید.
مثال پایه
فرم افقی
اندازه ستون
همانطور که در مثال های قبلی نشان داده شد، سیستم گرید ما به شما امکان می دهد هر تعداد .cols را در یک قرار دهید .row.
اندازه گیری خودکار
ناودان
طرحبندیهای پیچیدهتری را نیز میتوان با سیستم شبکه ایجاد کرد.
چک باکس سفارشی - پایه
پشتیبانی از رنگ های برند بوت استرپ: .form-checkو
.form-check-*غیره
کادر انتخاب سفارشی - دایره شده
.rounded-circleبرای گرد بودن
چک باکس سفارشی - غیرفعال است
حالت غیر فعال نیز پشتیبانی می شود.
رادیو سفارشی - پایه
پشتیبانی از رنگ های برند بوت استرپ: .form-checkو
.form-check-*غیره
رادیو سفارشی - غیرفعال است
حالت غیر فعال نیز پشتیبانی می شود.
