Выпадающие списки в HTML-формах.

Выпадающие списки в HTML-формах имеют интересную конструкцию, которорая состоит из тега-оболочки select и тегов-элементов option. Атрибут name присваивается тегу select, а атрибут value тегу option.

<select name="name_spiska" >
       <option value="0"> Ваш возраст </option>
       <option value="1"> до 18 </option>
       <option value="2"> 18-35 </option>
       <option value="3"> 35-50 </option>
       <option value="4"> больше 50 </option>
 </select>

Результат:

При использовании в одной HTML-форме двух или более списков помещать их в таблицу нет необходимости. За исключением случаев если этого требует ваш дизайн(шаблон) сайта.

В выпадающем списке всегда(по умолчанию) первым отображается верхний элемент. Но умолчания для того и придумали чтобы их можно было менять на нужное вам значение. Делается это при помощи атрибута selected, который присваивается тегу option без значения.

<select name="name_spiska" >
       <option value="1"> до 18 </option>
       <option value="2" selected> 18-35 </option>
       <option value="3"> 35-50 </option>
       <option value="4"> больше 50 </option>
 </select>

Выбрать возраст:

Из выпадающего списка можно сделать прокручивающийся список при помощи атрибута size тега select.

<select name="name_spiska" size="3">
       <option value="1"> до 18 </option>
       <option value="2"> 18-25 </option>
       <option value="3"> 25-35 </option>
       <option value="4"> 35-50 </option>
       <option value="5"> 50-60 </option>
       <option value="6"> больше 60 </option>
 </select>


Как заметили, значение атрибута size является цифра, которая указывает сколько элементом должно отображаться, в моем примере три.

Закончить эту главу хотел-бы следующим, не все браузеры поддерживают прокручивающиеся списки, у них отсутствует полоса прокрутки, а это может заставить сделать пользователей не верный выбор. Так что лучше отказаться от использования атрибута size.