HTML. Основные теги
advertisement
1 Язык HTML Вид Web-страницы задается тэгами, которые заключаются в угловые скобки. Тэги могут быть одиночными и парными, для которых обязательно наличие открывающего и закрывающего тэгов (такая пара тэгов называется контейнером). Закрывающий тэг содержит прямой слэш (/) перед обозначением. Тэги могут записываться как прописными, так и строчными буквами. HTML-код страницы помещается внутрь контейнера < HTML> </ HTML>. Заголовок Web-страницы заключается в контейнер < HEAD> </ HEAD> и содержит название документа. Название Web-страницы содержится в контейнере <TITLE></TITLE> и отображается при ее просмотре в строке заголовка браузера. Основное содержание страницы помещается в контейнер <ВОDY></ВОDY> <HTML> <HEAD> <TITLE>Название страницы</TITLE> </HEAD> <BODY> ................... </BODY> </HTML> Фон документа <BODY BGCOLOR=”название цвета”> или <BODY BACKGROUND=”url изображения”> Заголовки Заголовки служат для выделения логических частей текста. Всего может быть шесть уровней заголовков: от <Нl> (самый крупный) до <Н6> (самый мелкий). Выравнивание заголовка в тексте: ALIGN=”вид выравнивания (center, right, left)” Например: <HTML> <HEAD> <TITLE>Название страницы</TITLE> </HEAD> <BODY BGCOLOR=”gray”> <Н1 align=”center”>Все о компьютере</Н1> <Н3 align=”left”>Программное обеспечение</Н3> </BODY> </HTML> Заголовок целесообразно отделить от остального содержания страницы горизонтальной линией с помощью одиночного тэга <HR> (можно задать цвет и толщину линии) <HR> (тонкая черная линия) 2 <HR color="red" size=5> (толстая красная линия) Форматирование текста С помощью тэга <FONT> и его атрибутов можно задать параметры форматирования шрифта любого фрагмента текста. Атрибут FACE позволяет задать гарнитуру шрифта (например, FACE="Arial"). Атрибут SIZE - размер шрифта (например, SIZE=4). Атрибут COLOR - цвет шрифта (например, COLOR="blue"). Например: <FONT FACE=”Arial” SIZE=3 COLOR=”red”> Разделение текста на абзацы производится с помощью контейнера <Р></Р>. При просмотре в браузере абзацы отделяются друг от друга интервалами. Для каждого абзаца можно задать определенный тип выравнивания. Переход на новую строку – одиночный тэг <BR> <I> - курсив <U> - подчеркнутый <B> - полужирный Например: <P ALIGN="left"> <i>Ha этом</i> сайте вы сможете <br>получить <b>различную</b> информацию о компьютере, <u>его программном</u> обеспечении и ценах на компьютерные комплектующие. </P> Вставка изображений. BACKGROUND=”url изображения”На Web-страницах графические файлы трех форматов GIF, JPG и PNG. <IMG SRC="url изображения"> могут размещаться BACKGROUND=”url изображения” BACKGROUND=”url изображения”Например: <IMG SRC=" http://www.server.ru/computer.gif" > <IMG SRC=" С: \computer\computer.gif" > Если файл с изображением находится в той же папке, где и главная страница, то путь указывать не надо, только имя: <IMG SRC="computer.gif" > Пользователи иногда, в целях экономии времени, отключают в браузере загрузку графических изображений и читают только тексты. Поэтому, чтобы не терялся смысл и функциональность страницы, вместо рисунка должен выводиться поясняющий текст. Поясняющий текст выводится с помощью атрибута ALT, значением которого является текст, поясняющий, что должен был бы увидеть пользователь на рисунке: <IMG SRC="computer.gif" АLТ="Компьютер"> ? Расположить рисунок относительно текста различным образом позволяет атрибут АLIGN тэга <IMG>, который может принимать пять различных значений: TOP(верх), MIDDLE (середина), BOTTOM (низ), LEFT (слева) и RIGHT (справа). 3 Для того чтобы рисунок располагался по правому краю текста, тэг вставки изображения должен принять следующий вид: <IMG SRC="computer.gif" ALТ="Компьютер" ALIGN="right"> ! Выравнивание «right» и «left» работает, а чтобы расположить рисунок по центру лучше использовать контейнер <center> </center>: <center> <IMG SRC="computer.gif" ALТ="Компьютер"> </center> Атрибут WIDTH позволяет задать размер рисунка. Например: <IMG SRC="computer.gif" ALТ="Компьютер" WIDTH=”200” ALIGN="right"> Гиперссылки на Wеb-страницах Первая титульная страница должна обеспечивать посетителю Web-сайта возможность начать «путешествие» по сайту. Для этого на титульную страницу должны быть помещены гиперссылки на другие страницы сайта. Для создания гиперсвязей между титульной страницей и другими страницами сайта необходимо, прежде всего, создать заготовки Web-страниц. Такие «пустые» страницы должны иметь заголовок, но могут пока не иметь содержания. Все создаваемые страницы необходимо сохранить в виде файлов в папке сайта. Каждая страница будет содержать следующий НТМL-код: <HTML> <HEAD> <TITLE>Заголовок страницы</TITLE> </HEAD> <BODY> ... </BODY> </HTML> Контейнер гиперссылки <А>< /А> с атрибутом HREF, значением которого является URLадрес документа на локальном компьютере или в Интернете. Контейнер должен содержать указатель гиперссылки: <A HREF="URL">Указатель гиперссылки</A> Например: [<A HREF="glоssаrу.htm">Словарь</А>] Принято размещать гиперссылки в нижней части страницы Такое размещение гиперссылок часто называют панелью навигации. 4 Панель навигации будет представлять собой абзац, выровненный по центру, в котором указатели гиперссылок разделены пробелами (&nbsp): Например: <P ALIGN= "center"> [<A HREF="software.htm">Программы</А>] &nbsp [<A HREF="glоssаrу.htm">Словарь</А>] &nbsp [<A HREF="hardware. htm">Комплектующие</А>] &nbsp [<A HREF="anketa.htm">Aнкетa</A>] </P> Гиперссылка в виде рисунка: <a href="page.html"><img src="images/pict.JPG" border="0" width="100" height="70"alt="Подробнее"></a> Вставка комментария <!-- текст комментария --> Вставка аудио и видео Чтобы вставить на страницу звуковой файл или видеоизображение, используется контейнер гиперссылки <А>< /А> <A HREF="имя файла с расширением">Поясняющий текст </A> Файлы могут быть в форматах MP3, WAV, AVI, ... Например: <a href="sound.wav">Послушать Президента </a> <p align="center" ><br><br><font size="+1"><a href="video.mpg"> Кадры старой хроники<br><font size="+0"> </a>(40 Мб)</font></p><br> Полезно на титульной странице сайта создать ссылку на адрес электронный почты, по которому посетители могут связаться с администрацией сайта. Для этого необходимо 5 атрибуту ссылки HREF присвоить URL-адрес электронной почты и вставить ее в контейнер <ADDRESS></ADDRESS>, который задает стиль абзаца, принятый для указания адреса, и содержащий адрес электронной почты. Упражнение 6 Вставить в титульную страницу код, создающий ссылку на адрес электронной почты: <ADDRESS> <A HREF="mailto:mailbox@provaider.ru">E-mail: mailbox@provaider.ru</A> </ADDRESS> По щелчку мыши по ссылке адреса электронной почты будет открываться почтовая программа Outlook Expгess (или другая используемая по умолчанию почтовая программа), где в строке “Кому”) будет указан заданный в ссылке адрес. Созданная титульная страница Web-сайта «Компьютер» содержит заголовок, рисунок, текст, панель навигации и ссылку на адрес электронной почты. ВОПРОСЫ 1. Какую функцию выполняют гиперссылки на Web-страницах? 2. Что может использоваться в качестве объекта для создания гиперссылки? 3. Чем различаются абсолютный и относительный адреса документа? Практические задания 1. Разместите панель навигации и электронный почтовый адрес на титульной странице вашего сайта. 2. Разместите панель навигации на всех страницах вашего сайта. Списки на Web-страницах Довольно часто при размещении текста на Web-страницах удобно использовать списки, в различных вариантах: нумерованные списки, когда элементы списка идентифицируются с помощью чисел; маркированные списки (в HTML их принято называть ненумерованными), когда элементы списка идентифицируются с помощью специальных символов (маркеров); списки определений, позволяющие составлять перечни определений в так называемой словарной форме. Возможно создание и вложенных списков, причем вкладываемый список может по своему типу отличаться от основного. На странице «Программы» разместим информацию об основных типах программного обеспечения компьютера в форме вложенного списка. Сначала создадим основной нумерованный список основных категорий программного обеспечения. Список располагается внутри контейнера <OL></OL>, а каждый элемент списка определяется тэгом <LI>. С помощью атрибута TYPE тэга <OL> можно задать тип нумерации: арабские цифры (по умолчанию), "I" (римские цифры), "а" (прописные буквы) и др. Упражнение 7 Открыть в Блокноте файл softwaгe.htm, ввести заголовок Программное обеспечение и добавить следующий НТМL-код, задающий список: <OL> <LI>Системные программы <LI>Прикладные программы 6 <LI>Системы программирования </OL> Создадим теперь вложенный ненумерованный список для одного из элементов основного списка. Список располагается внутри контейнера <UL></UL>, а каждый элемент списка определяется также тэгом <LI>. С помощью атрибута TYPE тэга <UL> можно задать вид маркера списка: "disc" (диск) – по умолчанию, "square" (квадрат) или" circle" (окружность). Упражнение 8 Добавить НТМL-код, задающий вложенный список для элемента <LI> Прикладные программы: <UL> <LI TYPE="square" > текстовые редакторы; <LI TYPE="circle" > графические редакторы; <LI>электронные таблицы; <LI>системы управления базами данных. </UL> Страницу «Словарь» мы представим в виде словаря компьютерных терминов. Для этого используем контейнер списка определений <DL></DL>. Внутри него текст оформляется в виде термина, который выделяется непарным тегом <DT> и определения, которое следует за тегом <DD>. Упражнение 9 Открыть в Блокноте файл glossary.htm, ввести заголовок Компьютерные термины и добавить следующий НТМL-KOД, задающий список определений: <DL> <DТ>Процессор <DD>Центральное устройство компьютера, производящее обработку информации в двоичном коде <DТ>Оперативная память <DD>Устройство, в котором хранятся программы и данные </DL> КОНТРОЛЬНЫЕ ВОПРОСЫ 1. Какие типы списков могут быть созданы на Web-страницах? Практические задания 1. Примените на Web-странице вложенный список, содержащий разные типы списков. Таблицы на Wеb-страницах Элемент таблицы TABLE применяется в HTML-документах как для табличного представления символьных и графических данных, так и для разбиения страницы на отдельные области, в которых располагается содержимое различных HTML-элементов 7 (например, логотип сайта, баннер и элементы интерфейса навигации) Строки (элемент TR) Каждая строка таблицы начинается тегом <TR>, а заканчивается </TR>. Закрывающий тег </TR> не обязателен, но его рекомендуется ставить для обозначения границы каждой строки. Внутри каждого элемента TR размещается описание ячеек заголовков или ячеек данных. Шаблон кода простой таблицы имеет вид: <TAВLE> <ТR><!--Первая строка таблицы--></ТR> <ТR><!--Вторая строка таблицы--></ТR> …………………………………………………………………………………………………… … <ТR><!--Последняя строка таблицы--></ТR> </TABLE> Ячейки (элемент TD) Для описания содержимого отдельных ячеек таблицы предназначен парный тег <TD>. Текстовое содержимое ячеек данных по умолчанию отображается шрифтом, заданным в начальных настройках браузера. Составим НТМL-код небольшой таблицы, например, со списком адресов российских чатов. Будем считать, что такая таблица состоит из четырех строк по две ячейки в каждой: < HTML > <HEAD> <ТIТLЕ>Пример таблицы</ТIТLЕ> </HEAD> <BODY> <Н2>Российские чаты</Н2> <TABLE border=l> <TR> <ТD>Название чата</ТD> <ТD>Адрес</ТD> </TR> <TR> <ТD>СуперМегаЧат</ТD> <TD>http://smchat.ru/</TD> </TR> <TR> <ТD>Клуб ACЬKa</TD> <TD>http://asya-сlub.ru/</ТD> </TR> <TR> <TD>RusТusovka</TD> <TD>http://www.rustusovka.com/</TD> </TR> </TABLE> </BODY> < /HTML > 8 Каждая строка таблицы в данном примере содержит одинаковое количество ячеек, а начальный тег <TAВLE> дополнен атрибутом border=l. Если бы атрибут border отсутствовал, браузер отобразил бы таблицу без рамок. Ширина таблицы (атрибут width) Ширина таблицы - это параметр, общий для всех ее строк, и поэтому задается он в теге <TAВLE> атрибутом width. Значение ширины может быть установлено как в пикселах, так и в процентах (от полной ширины окна браузера). Например, тег <TAВLE width=300> задает таблицу с шириной всех строк, равной 300 пикселам. для построения таблицы шириной, например, 55% окна вам достаточно записать такой тег <TAВLE width="55%"> Задание ширины в процентах имеет то преимущество, что строки таблицы будут, как правило, полностью отображаться в окне браузера (без прокрутки). Выравнивание таблицы в документе (атрибут align) Для назначения положения таблицы относительно боковых границ окна браузера применяется атрибут align тега <TAВLE>. Этот атрибут может принимать одно из трех значений: left (размещение таблицы вдоль левого края документа; это значение задается по умолчанию), center (центрирование) и right (размещение таблицы вдоль правого края документа). Например, таблица шириной 25% от размера окна браузера, расположенная вдоль правого края страницы, задается следующим HTМL-KOДOM: <HТМL> <HEAD> <ТIТLЕ>Выравнивание таблицы</ТIТLЕ> </HEAD> <BODY> <TAВLE border="l" width="25%" align="right" > <ТR><ТD>Магазин</ТD></ТR> <ТR><ТD>Наши возможности</ТD></ТR> <ТR><ТD>Наши планы</ТD></ТR> <ТR><ТD>Корзина</ТD></ТR> <ТR><ТD>Регистрация</ТD></ТR> <ТR><ТD>Помощь</ТD></ТR> </TAВLE> </BODY> </HTМL> 9 Вывод внешней рамки (атрибут border) Если в элементе TABLE отсутствует атрибут border (либо он равен нулю), браузер создаст таблицу без видимой рамки (границы). Таблицы без рамок часто используются для позиционирования различных компонентов страницы: Если атрибут border указан, то есть дескриптор таблицы имеет вид <TABLE border> то таблица будет отображена с внешними и внутренними границами в виде двойной линии толщиной 1 пиксел. для задания иной толщины внешней границы нужно указать числовое значение атрибута border, например, тег <TAВLE border=10> определяет таблицу с внешней границей 10 пикселов и линиями внутренних границ 1 пиксел 10 Ширина границ таблицы (атрибут cellspacing) Границы таблицы по умолчанию отображаются двойной линией, причем расстояние между линиями (зазор) равно 2 пиксела. Если вы хотите изменить величину зазора в двойной линии, необходимо тег <TAВLE> дополнить атрибутом cellspacing (в переводе - расстояние между ячейками). Значение этого атрибута, которое задается положительным целым числом, определяет толщину двойной линии границ. Расстояние, от содержимого ячейки до рамки (атрибут cellpadding) В HTМL предусмотрен атрибут cellpadding, задающий расстояние в пикселах от содержимого ячейки до рамки. Этот атрибут применяется в составе тега <TAВLE>. ПО умолчанию значение cellpadding устанавливается равным 1 пикселу. В качестве примера действия атрибута cellpadding приведем две таблицы, содержащиеся в следующем HTМL-дoкyмeнтe: <HTМL> <НЕAD> <ТIТLЕ>Атрибут cellpadding</TITLE> </НЕAD> <BODY> <Н2>Таблицы с различным расстоянием от содержимого до границы ячейки</Н2> <TAВLE border=l> <ТR> <ТD>Без атрибута</ТD> <TD>cellpadding</TD> </TR> 11 </TAВLE> <TAВLE border=l cellpadding =30 > <TR> <TD>C атрибутом</ТD> <ТD>cellpadding =30</ТD> </ТR> </TABLE> </BODY> </HТМL> Форматирование строк и ячеек Рассмотренные выше свойства относились к таблице в целом, но часто возникает необходимость задать специальное форматирование для ячеек строки. для этого предусмотрены атрибуты тега <TR>. Например, размеры ячеек строки устанавливаются знакомыми вам атрибутами width (ширина) и height (высота) Выравнивание содержимого По умолчанию содержимое всех ячеек выравнивается по левому краю каждой ячейки (за исключением заголовков, для которых установлено выравнивание по центру). Для задания иного вида выравнивания в теги <TR> или <TD> вводятся атрибуты align, принимающие, как обычно, значения left, right, Например, теги <TR align="right"> <TD align="center"> определяют соответственно выравнивание содержимого всех ячеек строки (тег <TR>) по правой границе ячеек и выравнивание содержимого конкретной ячейки (тег <TD>) по центру. С помощью атрибута valign вы можете задавать выравнивание содержимого по вертикали. Этот атрибут применяется с такими значениями: top (выравнивание по верхнему краю 12 ячеек), bottom (по нижнему краю ячеек), middle (центрирование по вертикали. Например, тег <TR valign="middle"> назначает центрирование по вертикали содержимого ячеек строки. А смещение к верхнему краю ячейки устанавливается тегом: <ТН valign="top"> 3адание ширины и высоты При создании Web-страниц часто возникает необходимость установления линейных размеров (высоты и ширины) компонентов таблицы. Для задания высоты в тегах <TD>, <ТН> и <TR> предусмотрен знакомый вам атрибут height. Ширина элементов <TD> и <ТН> определяется атрибутом width. Целочисленные значения этих атрибутов задают размеры в пикселах. Например, ячейка данных высотой 30 и шириной 70 пикселов задается тегом <TD height=30 width=70> Объединение ячеек таблицы Все рассмотренные нами ранее примеры таблиц имели в каждой строке одинаковое количество ячеек. Но иногда приходится создавать таблицы, в которых смежные ячейки должны быть объединены. Достигается это использованием в начальных тегах <ТН> или <TD> следующих атрибутов. rowspan - предназначен для объединения ячеек смежных строк. Значение атрибута задает количество объединяемых ячеек. colspan - назначает объединение ячеек смежных столбцов. Рассмотрим пример НТМL-документа, в котором таблица имеет объединенные ячейки: <HTМL> <HEAD> <ТIТLЕ>Объединение ячеек</ТIТLЕ> </НЕAD> <BODY> <Н2>Магазин "Школяр" предлагает учебники:</Н2> <TAВLE border> <ТR><ТН>Предмет</ТН><ТН>Раздел</ТН><ТН>Классы</ТН></ТR> <TR> <TD rоwsрan=5>Математика</ТD><ТD>Арифметика</ТD><TD>l&ndash; 4</TD> </TR> <ТR> <ТD>Алгебра</ТD><ТD>5&ndash; 11</TD> </TR> <ТR> 13 <ТD>Геометрия</ТD> <ТD>7&ndash; 11</TD> </TR> <ТR> <ТD>Тригонометрия</ТD> <ТD>10&ndash; 11</TD> </TR> <TR> <TD colspan=2><I>Количество наименований: 1090</I></TD> </TR> <TR> <TD rоwsрan=4>Физика</ТD><ТD>Механика</ТD><TD>5&ndash; 7</TD> </TR> <ТR> <ТD>Электричество</ТD> <ТD>7&ndash; 9</TD> </TR> <ТR> <ТD>Оптика</ТD> <ТD>10&ndash; 11</TD> </TR> <TR> <TD colspan=2><I>Количество наименований: 457</I></TD> </TR> </TABLE> </BODY> </HTML> 14 Формы на Wеb-страницах Для того чтобы посетители сайта могли не только просматривать информацию, но и отправлять сведения его администраторам, на страницах сайта размещают формы. Формы представляют собой управляющие элементы различных типов: текстовые поля, раскрывающиеся списки, флажки, переключатели и Т.д. Разместим на странице «Анкета» анкету для посетителей, чтобы выяснить, кто из наших посетителей, с какими целями и с помощью каких программ получает и использует информацию из сети Интернет, а также выясним, какую информацию они хотели бы видеть на нашем сайте. Вся форма заключается в контейнер <FORM></FORM>. В первую очередь выясним имя посетителя нашего сайта и его электронный адрес, чтобы иметь возможность ответить ему на замечания и поблагодарить за посещение сайта. Текстовые поля. Для получения этих данных разместим в форме два однострочных текстовых поля для ввода информации. Текстовые поля создаются с помощью тэга <INPUT> со значением атрибута TYPE="text". Атрибут NAМE является обязательным и служит для идентификации полученной информации. Значением атрибута SIZE является число, задающее длину поля ввода в символах. Для того чтобы анкета «читалась», необходимо разделить строки с помощью тэга перевода строки <BR>. Упражнение 10 Открыть в Блокноте файл anketa.htm и добавить следующий НТМLкод, создающий текстовые поля для ввода данных. Просмотреть страницу в браузере: <FORM> Пожалуйста, введите Ваше имя: <BR> <INPUT TYPE="text" NAME="name" SIZE=30><BR> E-mail: <BR> <INPUT TYPE="text" NAME="e-mail" SIZE=30> </FORM> Переключатели. Далее, мы хотим выяснить, к какой пользовательской группе относит себя посетитель. Дадим ему возможность выбрать один из нескольких предложенных вариантов: учащийся, студент, учитель. Для этого необходимо создать группу переключателей («радиокнопок»). Создается такая группа с помощью тэга <INPUT> со значением атрибута TYPE="radio". Все элементы в группе должны иметь одинаковые значения атрибута NAМE. Например, NAМE="group". Еще одним обязательным атрибутом является VALUE, которому присвоим значения" schoolboy", "student" и "teacher". Значения атрибута VALUE должны быть уникальными для каждой «радиокнопки», т.к. при ее выборе именно они передаются серверу. Атрибут СНЕСКЕD, который задает выбор кнопки по умолчанию, в данном случае не используется. Упражнение 11 Добавить НТМL-код, создающий группу переключателей для выбора одного варианта. Просмотреть страницу в браузере: Укажите, к какой группе пользователей вы себя относите: <BR> <INPUT TYPE="radio" NAME="group" VALUE=”schoolboy”> учащийся<BR> 15 <INPUT TYPE="radio" NAME="group" VALUE=”student”> студент<BR> <INPUT TYPE="radio" NAME="group" VALUE=”teacher”> учитель<BR> Флажки. Далее, мы хотим узнать, какими сервисами Интернета наш посетитель пользуется наиболее часто. Здесь из предложенного перечня он может выбрать одновременно несколько вариантов, пометив их флажками. Флажки создаются в тэге со значением атрибута TYPE="checkbox". Флажки, объединенные в группу, могут иметь одинаковые значения атрибута NAМE. Например, NAМE="group". Еще одним обязательным атрибутом является VALUE, которому присвоим значения "www", "e-mail" и "ftp". Значения атрибута VALUE должны быть уникальными для каждого флажка, т.к. при его выборе именно они передаются серверу. Атрибут СНЕСКЕD, который задает выбор кнопки по умолчанию, в данном случае не используется. Упражнение 12 Добавить НТМL-код, создающий флажки для выбора нескольких вариантов. Просмотреть страницу в браузере: Какие из сервисов Интернета вы используете наиболее часто:<BR> <INPUT TYPE="checkbox" NAМE="group" VALUE="www"> WWW<BR> <INPUT TYPE="checkbox" NAМE="group" VALUE="e-mail "> e-mail<ВR> <INPUT TYPE="checkbox" NAМE="group" VALUE="ftp"> FTP<BR> Списки. Теперь выяcним, какой из браузеров предпочитает посетитель сайта. Перечень браузеров представим в виде раскрывающегося списка, из которого можно выбрать только один вариант. Для реализации такого списка используется контейнер <SELECT></SELECT>, в котором каждый элемент списка определяется тэгом <OPTION>. Выбранный по умолчанию элемент задается с помощью атрибута SELECTED. Упражнение 13 Добавить НТМL-код, создающий раскрывающийся список для выбора одного варианта. Просмотреть страницу в браузере: <SELECT NAМE="browsers"> <OPTION SELECTED> Internet Explorer <OPTION> Netscape Navigator <OPTION> Opera <OPTION> Neo Planet </SELECT> <BR> Текстовая область. В заключение поинтересуемся, что хотел бы видеть посетитель на наших страницах, какую информацию следовало бы в них добавить. Так как мы не можем знать заранее, насколько обширным будет ответ читателя, отведем для него текстовую область с линейкой прокрутки. В такое поле можно ввести достаточно подробный текст. Создается такая область с помощью тэга <TEXTAREA> с обязательными атрибутами: NAМE, задающим имя области, ROWS, определяющим число строк, и COLS - число столбцов области. 16 Упражнение 14 Добавить НТМL-код, создающий текстовую область для ввода комментариев, просмотреть страницу в браузере: Какую еще информацию вы хотели бы видеть на нашем сайте?<ВR> <TEXTAREA NAМE="resume" ROWS=4 COLS=30> </TEXTAREA><BR> Отправка данных из формы. Отправка введенной в форму информации или очистка полей от уже введенной информации осуществляется с помощью кнопок. Кнопки создаются с помощью тэга <INPUT>. ДЛЯ создания кнопки, которая отправляет информацию, атрибуту TYPE необходимо присвоить значение" submit", а атрибуту VALUE, который задает надпись на кнопке, присвоить значение "Отправить". Для создания кнопки, которая производит очистку формы, атрибуту TYPE необходимо присвоить значение"reset", а атрибуту VALUE - значение "Очистить". Упражнение 15 Добавить НТМL-код, создающий кнопки: <INPUT TYPE="submit" VАLUЕ="Отправить"> <INPUT TYPE="reset" VАLUЕ="Очистить"> Заполненная форма отправляется на сервер, где обрабатывается специальной программой - СGI-скриптом, или по электронной почте автору сайта, где он уже самостоятельно обрабатывает полученные данные. Для того чтобы при щелчке по кнопке Отправить данные из формы передавались на сервер и там обрабатывались, необходимо указать, куда их отправить и какая программа будет их обрабатывать. Эти параметры задаются с помощью атрибута ACTION контейнера <FORM>. <FORM ACTION="URL"></FORM> Атрибут ACTION определяет URL-адрес программы, расположенной на Webсервере, которая обрабатывает полученные данные из формы. Пусть программой, которая заносит данные из формы в базу данных, будет программа bd.exe. Обычно такие программы хранятся в каталоге cgi-bin, тогда атрибут ACTION будет выглядеть следующим образом: АСТIОN="http:/www.mycompany.ru/cgi-bin/bd.exe"
