Чекбоксы
без тега
label
Радиокнопки
без тега
label
Поле для выбора файла
Одиночные селекты
По умолчанию ширина селекта на этой странице установлена 250 пикселей.
Простой селект с несколькими пунктами,
один из них неактивный.
Селект без заданной ширины, имеющий пункт с длинным текстом.
Селект с шириной 200 пикселей, имеющий пункт с длинным текстом.
Выпадающий список этого селекта
органичен по высоте.
Селект с длинным списком, не ограниченным максимальной высотой.
Проверяем, правильное ли значение передается при изменении. У оригинального селекта прописано: onchange="alert(this.value)".
Селект с группировкой пунктов
(используется тег optgroup), один из них неактивный.
Селект с выделением групп разными цветами (указаны классы .color1 и .color2 для optgroup).
Показываем, что селект изменен, используя класс .changed (появляется зеленая обводка).
Класс, указаннный для option, передается свернутом селекту, благодаря чему мы в нем видим флаг.
Мультиселекты
Мультиселект, один из пунктов неактивный,
параметр size не указан.
- -- Выберите --
- Пункт 1
- Пункт 2
- Пункт 3
- Пункт 4
- Пункт 5
Мультиселект с параметром size равным 6 и с заданной шириной (400 пикселей).
- -- Выберите один или несколько пунктов --
- Пункт 1
- Пункт 2
- Пункт 3
- Пункт 4
- Пункт 5
Мультиселект с группировкой пунктов (используется тег optgroup), один из них неактивный.
- -- Выберите --
- Группа 1
- Пункт 1.1
- Пункт 1.2
- Пункт 1.3
- Группа 2
- Пункт 2.1
- Пункт 2.2
- Пункт 2.3
Мультиселект с выделением групп разными цветами (указаны классы .color1 и .color2 для optgroup).
- -- Выберите --
- Группа 1
- Пункт 1.1
- Пункт 1.2
- Пункт 1.3
- Группа 2
- Пункт 2.1
- Пункт 2.2
- Пункт 2.3
Прочие элементы форм (только CSS)