Пример 136
<html>
<body>
<form name="input" action="form.php" method="get">
Введите Ваше имя: <input type="text" name="name" />
<input type="submit" value="Отправить" />
</form>
</body>
</html>
Выпадающий список
Для создания выпадающих списков используется тэг <select>, а элементы выпадающего списка определяются с помощью тэга <option>.
Обратите внимание: пользователи не любят вводить данные вручную, поэтому если Вы можете заменить обычное текстовое поля выпадающим списком, радио кнопками, или флажками обязательно сделайте это.
Пример 137
<html>
<body>
<p>Выберите Ваш пол: </p>
<form>
<select name='sex' >
<option value='m'> Мужской </option>
<option value='f'> Женский </option>
</select>
</form>
</body>
</html>
С помощью атрибута multiple Вы можете указать, что в выпадающем списке могут быть выбраны одновременно несколько элементов.
Пример 138
<html>
<body>
<p>В данном списке может быть одновременно выбрано несколько значений (для этого зажмите клавишу Ctrl и щелкайте на необходимые элементы): </p>
<form>
<select name='city' multiple='multiple'>
<option value='london'>Лондон</option>
<option value='moskva'>Москва</option>
<option value='newyork'>Нью Йорк</option>
</select>
</form>
</body>
</html>
Заголовки в формах
Для того, чтобы озаглавить группу элементов формы, Вы должны с помощью тэга <fieldset> сгруппировать желаемую часть формы и затем с помощью тэга <legend> установить желаемое заглавие.
Пример 139
<html>
<body>
<form>
<fieldset>
<legend>Данные о пользователе</legend>
Имя: <br /><input type='text' name='firstname' /><br />
Фамилия:<br /> <input type='text' name='lastname' /><br />
Отчество: <br /><input type='text' name='lastname' /><br />
<p>Укажите ваш пол:</p>
<input type='radio' name='s' value='m' /> Мужской<br />
<input type='radio' name='s' value='f' /> Женский
</fieldset>
<fieldset>
<legend> Анкета: </legend>
<p>Как вы относитесь к полетам в космос:</p>
<input type='checkbox' name='space' value='1' />
Положительно, всегда хотел полететь в космос<br />
<input type='checkbox' name='space' value='2' />
Безразлично, никогда не думал об этом серьезно <br />
<input type='checkbox' name='space' value='3' />
Отрицательно, меня с детства отталкивают мысли о космосе <br />
</fieldset>
</form>
</body>
</html>
Сделайте сами
Задание 1 исправьте ошибки в коде.
Пример 1310
<html>
<body>
<form>
<fieldsit>
<legend>Поле авторизации
Логин: <br /><input type='password' name='login' /><br />
Пароль:<br /> <input type='text' name='pas' /><br /><br />
<input type='chickbox' name='session' value='1' />
Длинная сессия
<input type='chickbox' name='session' value='2' />
Короткая сессия<br /><br />
<input type='buton' value='Авторизоваться' />
</fieldsit>
</form>
</body>
</html>
После исправления ошибок форма должна корректно отображаться в редакторе:
Начало формы
Поле
авторизации Логин:
Пароль:
1 Длинная
сессия
2
Короткая сессия
Авторизоваться 14. HTML фреймы
Обратите внимание: фреймы на данный момент считаются устаревшей технологией и не будут поддерживаться в HTML5 (это относится только к обычным фреймам, строковые фреймы рассмотренные далее в данной главе не считаются устаревшими). Не используйте обычные фреймы в своих проектах!
В одном окне браузера может быть отображено несколько веб-страниц, которые в данном случае будут называться фреймами.
С помощью HTML тэга <frameset> Вы можете описать как будут располагаться фреймы в окне браузера.
Тэг <frame> описывает один отдельный фрейм. В его атрибуте src должен указываться адрес документа, который будет отображен в данном фрейме.