Лабораторная работа № 6
Тема: Создание документа с формами.
Цель: Научиться создавать веб-документы, содержащие
формы.
Оборудование и программное обеспечение:
· Персональный компьютер IBM PC/AT.
· Операционная система Windows
95/98/NT/2000/2003/XP.
Практическая часть.
1. Изучили теоретическую часть:
ü
Параметры тега <FORM >.
ü
Элементы формы.
2.
Создали HTML документ,
содержащий форму из приведённого в методическом пособии вида (рисунок №1).
<html>
<body>
<form>
<table
width="70%">
<tr>
<td
align="right">Фамилия: </td>
<td><input type="text"
size="30" value="Фамилия"></td>
</tr>
<tr><td
align="right">Имя: </td>
<td><input
type="text" size="30" value="Имя"></td>
</tr>
<tr>
<td
align="right">Отчество: </td>
<td><input
type="text" size="30" value="Отчество"></td>
</tr>
<tr>
<td align="right">Пароль: </td>
<td><input
type="password" size="30"></td>
</tr>
<tr>
<td
align="right">Адрес доставки:
</td>
<td><input
type="text" size="70" value="Город,улица,дом,квартира"></td>
</tr>
<tr> <td
align="right">Доставка: </td>
<td><input type="radio"
name="1" checked>Почтой</td>
</tr>
<tr>
<td></td>
<td><input
type="radio" name="1">Курьером</td>
</tr>
</table>
<table
width="30%">
<tr><td>Способ оплаты:</td><td>
<Select >
<option
value="1" checked>Наложенный платеж</option>
<option
value="2">Банковский перевод</option>
<option
value="3">Почтовый перевод</option>
<option
value="4">Наличный расчет</option>
</select></td></tr>
</table>
<br></br>
<br></br>
Дополнительная
информация
<table>
<tr>
<td
width="30%"></td>
<td><input
type="checkbox" name="a" value="1" checked>Накладная</td>
</tr>
<tr><td></td>
<td><input
type="checkbox" name="a" value="2">Остаток по счету</td>
</tr>
<tr><td></td>
<td><input
type="checkbox" name="a" value="3">Информация о новинках</td>
</tr>
</table>
<p>Ваши
пожелания:</p>
<textarea
rows="5" cols="50"></textarea>
<p></p>
<input
type="submit" value="Заказать"></input>
<input
type="submit" value="Отменить"></input>
</form>
</body>
</html>
3.
3.1 -
Используя теги форм,
создали форму (анкету) регистрации. В анкете содержится:.
-
текстовые поля для ввода
имени, отчества и фамилии;
-
поле пароля;
-
поле выбора из списка
значений;
-
поле для ввода большого
количества информации;
-
флажки;
-
переключатели;
-
кнопки сброса и отправки
запроса.
3.2 -
С помощью тегов HTML
отформатировали полученную анкету. В качестве фона использовали графическое
изображение (рисунок №2).
<html>
<body
background="Fresnel.jpg">
<form>
<table
width="40%" >
<tr><td></td><td><h2>Анкета</h2></td></tr>
<tr><td></td><td><h3>Регистрация</h3></td></tr>
</tr>
<tr>