پایه
پایه
به کنترل فرم متنی مانند<input>s and <textarea>s an upgrade with custom styles, sizing, focus states, and more.
حالت غیر فعال
اضافه کردنdisabled boolean attribute on an input to give it a grayed out appearance and remove pointer events.
رنگ
انتخاب کنید
سفارشی<select> menus need only a custom class, .form-select to trigger the custom styles. Custom styles are limited to the <select>’s initial
appearance and cannot modify the <option>s due to browser limitations.
همچنین می‌توانید از میان انتخاب‌های سفارشی کوچک و بزرگ انتخاب کنید تا با ورودی‌های متنی با اندازه مشابه مطابقت داشته باشد.
اینmultiple attribute is also supported
اضافه کردنdisabled boolean attribute on a select to give it a grayed out appearance and remove pointer events.
چک باکس و رادیو
چک باکس های پیش فرض مرورگر و رادیوها با کمک جایگزین می شوند.form-check, a series of classes for both input types that improves the layout and behavior of their HTML elements,
that provide greater customization and cross browser consistency. Checkboxes are for selecting one or several options in a list, while radios are for selecting one option from many.
اضافه کردنdisabled attribute and the associated <label>s are automatically styled to match with a lighter color to help indicate the input’s state.
با افزودن، کادرهای انتخاب یا رادیوها را در همان ردیف افقی گروه بندی کنید.form-check-inline to any .form-check.
چک باکس ها، رادیوها و سوئیچ های خود را در سمت مقابل قرار دهید.form-check-reverse modifier class.
بسته بندی را حذف کنید.form-check for checkboxes and radios that have no label text.
سوئیچ ها
یک سوئیچ دارای نشانه گذاری یک چک باکس سفارشی است اما از آن استفاده می کند.form-switch class to render a toggle switch. Switches also support the disabled attribute.
سایز بندی
تنظیم ارتفاع با استفاده از کلاس هایی مانند.form-control-lg and .form-control-sm.
فقط خواندنی
اضافه کردنreadonly boolean attribute on an input to prevent modification of the input’s value.
متن ساده فقط خواندنی
اگر می خواهید داشته باشید<input readonly> elements in your form styled as plain text, use the .form-control-plaintext class to remove the default form field styling and
preserve the correct margin and padding.
ورودی فایل
دامنه
سفارشی ایجاد کنید<input type="range"> controls with .form-range. The track (the background) and thumb (the value) are both styled to appear the same across browsers.
As only Firefox supports “filling” their track from the left or right of the thumb as a means to visually indicate progress, we do not currently support it.
اضافه کردنdisabled boolean attribute on an input to give it a grayed out appearance and remove pointer events.
به طور پیش فرض، محدوده ورودی \step value. In the example below, we double the number of steps by using step="0.5".
برچسب شناور
یک جفت بپیچید<input class="form-control"> and <label> elements in .form-floating to enable floating labels with Bootstrap’s textual form
fields. A placeholder is required on each <input> as our method of CSS-only floating labels uses the :placeholder-shown pseudo-element. Also note that
the <input> must come first so we can utilize a sibling selector (e.g., ~).
غیر از.form-control, floating labels are only available on .form-selects. They work in the same way, but unlike <input>s, they’ll always show the
<label> in its floated state. با انتخاب می کندsize and multiple are not supported.
برچسب های شناور نیز از کلاس های اندازه گیری پشتیبانی می کنند.
