Урок 7.6: Поле со списком

Вместо переключателей можно использовать поле со списком. В результате разницы никакой. Только у списков вариантов настроек больше.

Для создания списка нужен тег (парный) <select></select>. Этот тег укажет браузеру что перед ним элемент формы - поле со списком.

Внутри этого тега используя тег (парный) <option></option> в котором указываются элементы списка.

Пример создания поля со списком

<html>
 <head>
  <title>Поле со списком</title>
 </head>
 <body>
  <form>
   Ваш любимый цвет: <br />
   <select>
     <option>Синий</option>
     <option>Красный</option>
     <option>Зеленый</option>
   </select>
  </form>
 </body>
</html>

Результат

Поле со списком

Кроме выпадающего списка, еще можно создать список множественного выбора. Для этого в теге select нужно указать атрибут multiple

Пример создания списка множественного выбора

<html>
 <head>
  <title>Поле со списком</title>
 </head>
 <body>
  <form>
   Ваш любимый цвет: <br />
   <select multiple>
     <option>Синий</option>
     <option>Красный</option>
     <option>Зеленый</option>
   </select>
  </form>
 </body>
</html>

 

Список уроков