Bootstrap 5 Элементы управления формой Цвет

Опубликовано: 17 Февраля, 2023

Bootstrap 5 — это новейшая версия Bootstrap, самой популярной среды HTML, CSS и JavaScript для создания адаптивных веб-сайтов, ориентированных на мобильные устройства. Он был официально выпущен 16 июня 2020 года после нескольких месяцев переопределения его функций.

Bootstrap 5 Form Control Color используется для установки цвета в поле ввода типа цвета. Чтобы создать поле ввода с цветовым типом, атрибут type=”color” используется в элементе <input>.

Цвет управления формой

Используемый класс:

form-control-color: этот класс используется в элементе <input> и используется для создания поля ввода цвета.

Синтаксис:

<label for="colorfield" class="form-label">
      Color picker
</label>
<input type="color" 
      class="form-control form-control-color" 
      id="colorfield" value="..." title="...">

Пример 1. В этом примере мы будем использовать элементы <label> и <input> с классами .form-label , .form-control и .form-control-color для создания поля ввода цвета.

Выход:

Пример 2. В этом примере мы будем использовать элементы <label>, <input>, <datalist> и <option> с классами .form-label и .form-control для создания поля ввода параметра выбора цвета.

Выход:

Ссылка: https://getbootstrap.com/docs/5.0/forms/form-control/#color

Technical Scripter Picked Bootstrap

Bootstrap 5 Элементы управления формой Цвет

РЕКОМЕНДУЕМЫЕ СТАТЬИ