INFORMATIKA / Лабораторные работы / Исходные файлы для Word / Основы HTML

Например:

<TABLE BORDER=1 BGCOLOR=ANTIQUEWHITE WIDTH=40% ALIGN=LEFT>

<CAPTION ALIGN=TOP>Времена года</CAPTION>

<TR> <TH>Время года</TH> <TH>Месяц</TH> </TR>

<TR> <TD>Зима</TD> <TD>Декабрь<BR> Январь<BR>Февраль<BR></TD></TR>

<TR><TD>Весна</TD><TD>Март<BR>Апрель<BR>Май<BR></TD></TR>

<TR><TD>Лето</TD><TD>Июнь<BR>Июль<BR>Август<BR></TD></TR>

<TR><TD>Осень</TD><TD>Сентябрь<BR>Октябрь<BR>Ноябрь<BR></TD></TR>

</TABLE>

<BR><BR>

<H3>Последний вечер зимы</H3>

Меж зимою и весною<BR>Вечер - синею стеною,<BR>

Снегопад - крылом мохнатым слепит<BR>Засыпает он надежды,<BR>

Будет все вокруг - как прежде...<BR>

А весна в краю далеком - все спит.<BR>

Но я верю в то, что скоро<BR>Будет залит солнцем город.<BR>

И снега водою станут, уйдут,<BR>Унося зимы печали...<BR>

Из заморской дальней дали<BR>

Журавли весну на крыльях несут.<BR CLERAR=ALL>

Атрибут	Назначение
ALIGN=значение	Горизонтальное выравнивание текста внутри строки или ячейки. Применяется в тэгах <TR>, <TD>, <TH>. Возможные варианты: LEFT, RIGHT, CENTER.
VALIGN=значение	Вертикальное выравнивание текста внутри строки или ячейки. Применяется в тэгах <TR>, <TD>, <TH>. Возможные варианты: TOP, MIDDLE, BOTTOM.
NOWRAP	Отключает возможность автоматического разбиения текста ячейки на строки. Применяется в тэгах <TR>, <TD>, <TH>.
WIDTH=ширина	Ширина ячейки. Применяется в тэгах <TD>, <TH>. Задается в пикселях.
HEIGHT=высота	Высота ячейки. Применяется в тэгах <TD>, <TH>. Задается в пикселях.
COLSPAN=число_столбцов	Объединение нескольких смежных ячеек по горизонтали в одну.
ROWSPAN=число_строк	Объединение нескольких смежных ячеек по вертикали в одну.
BGCOLOR=цвет

Например:

<TABLE BORDER=1 CELLPADDING=4>

<CAPTION>ОБЪЕМ ПРОДАЖ</CAPTION>

<TR><TH>Город</TH><TH>Вид товара</TH><TH>Сумма продаж</TH></TR>

<TR><TD ROWSPAN=3 ALIGN=CENTER>Москва </TD><TD>Велосипеды</TD>

<TD ALIGN=RIGHT>1750</TD></TR>

<TR><TD>Роликовые доски</TD>

<TD ALIGN=RIGHT>400</TD></TR>

<TR><TD>Мопеды</TD><TD ALIGN=RIGHT>1000</TD></TR>

<TR><TD ROWSPAN=2 ALIGN=CENTER>Санкт-Петербург</TD><TD>Велосипеды</TD>

<TD ALIGN=RIGHT>1600</TD></TR>

<TR><TD>Роликовые доски</TD><TD ALIGN=RIGHT>600</TD></TR>

<TR><TD ALIGN=CENTER>Череповец </TD><TD>Велосипеды</TD>

<TD ALIGN=RIGHT>2000</TD></TR>

<TR><TD ALIGN=CENTER COLSPAN=2>Итог по продажам</TD><TD ALIGN=RIGHT> <B>7350</B></TD></TR>

</TABLE>

Для выравнивания содержимого всех ячеек текущей строки достаточно задать требуемые параметры в тэге <TR>. Для выравнивания содержимого внутри одного столбца предусмотрены специальные тэги <COL> и <COLGROUP>. Эти тэги должны располагаться сразу же за описанием тэга <TABLE> перед первым появлением тэга <TR>.

Атрибут	Назначение
SPAN=число	Определяет количество смежных столбцов, на которые распространяется действие выравнивания. Значение по умолчанию равно 1.
ALIGN=значение	Вариант выравнивания. Допустимые значения: LEFT; RIGHT; CENTER

Атрибут	Назначение
SPAN=число	Определяет количество смежных столбцов, на которые распространяется действие выравнивания. Значение по умолчанию равно 1.
ALIGN=значение	Вариант выравнивания. Допустимые значения: LEFT; RIGHT; CENTER.
VALIGN=значение	Выравнивание по вертикали. Возможные значения: TOP; MIDDLE; BOTTOM.

Используя тэг COLGROUP можно преобразовать текст предыдущего примера следующим образом:

<TABLE BORDER=1 CELLPADDING=4>

<COLGROUP ALIGN=CENTER VALIGN=MIDDLE>

<COLGROUP ALIGN=LEFT>

<COLGROUP ALIGN=RIGHT>

<CAPTION>ОБЪЕМ ПРОДАЖ</CAPTION>

<TR><TH>Город</TH><TH>Вид товара</TH><TH>Сумма продаж</TH></TR>

<TR><TD ROWSPAN=3>Москва</TD><TD>Велосипеды</TD><TD>1750</TD></TR>

<TR><TD>Роликовые доски</TD><TD>400</TD></TR>

<TR><TD>Мопеды</TD><TD>1000</TD></TR>

<TR><TD ROWSPAN=2>Санкт-Петербург</TD><TD>Велосипеды</TD><TD>1600</TD></TR>

<TR><TD>Роликовые доски</TD><TD>600</TD></TR>

<TR><TD>Череповец </TD><TD>Велосипеды</TD><TD>2000</TD></TR>

<TR><TD COLSPAN=2>Итог по продажам</TD><TD><B>7350</B></TD></TR>

</TABLE>

<TBODY> - выполняет логическую группировку данных. Может встречаться многократно в описании таблицы. Требует обязательного закрывающего тэга </TBODY>.

<THEAD> - тэг, используемый для описания верхнего колонтитула таблицы. Может встречаться в таблице не более одного раза. Часто используется при создании больших таблиц, выходящих за пределы одной страницы.

<TFOOD> - тэг, используемый для описания нижнего колонтитула таблицы. Может встречаться в таблице не более одного раза. Используется при создании больших таблиц, выходящих за пределы одной страницы.

Тэги <THEAD> и <TFOOD> не требуют обязательного закрывающего тэга.

Фреймы

Фреймы позволяют разбить окно просмотра на несколько прямоугольных подобластей, располагающихся рядом друг с другом. В каждую из подобластей можно загрузить отдельный HTML-документ, просмотр которого осуществляется независимо от других. Между фреймами можно организовать взаимодействие, которое заключается с том, что выбор ссылки в одном из фреймов может привести к загрузке нужного документа в другой фрейм или окно браузера.

Web-страницы, содержащие фреймы не содержат раздел BODY в своем HTML-коде. Этот раздел заменяется разделом FRAMESET.

Контейнер из тэгов <FRAMSET> и </FRAMESET> обрамляет каждый блок определений фрейма. Внутри контейнера <FRAMSET> могут содержаться только тэги <FRAME> и вложенные тэги <FRAMSET>.

Атрибут	Назначение
ROWS=«список_значений»	Строки фреймов. Задается в пикселях, процентах или относительных единицах.
COLS=«список_значений»	Столбцы фреймов. Задается в пикселях, процентах или относительных единицах.
BORDERCOLOR=цвет	Цвет рамки
BORDER=число	Толщина рамки
FRAMEBORDER= значение	Вывод объемной рамки Может принимать значения - yes/no

Если один из атрибутов ROWS или COLS опущен, то его значение принимается равным 100%.

Например:

Если необходимо разбить окно на два вертикальных фрейма шириной 40% и 60% от размеров окна и высотой 100%, то делается следующая запись тэга:

<FRAMESET COLS=40%,60%>

или

<FRAMESET COLS=40%,*>

При помощи (*) задаются значения в относительных единицах. (*) используется для пропорционального деления пространства в окне браузера. Каждая звездочка представляет собой одну часть целого. Складывая все значения чисел, стоящих у звездочек (если число опущено, то подразумевается единица), получим знаменатель дроби.

Например:

<FRAMESET ROWS=*,2*,3*>

Получим 1+2+3=6, т.е. знаменатель дроби равен 6. Окно будет разбито на три части, первая часть будет иметь высоту равную 1/6 от всей высоты окна, вторая – 2/3, третья – 3/6.

<FRAME> - определяет одиночный фрейм. Не имеет закрывающего тэга.

Атрибут	Назначение
SCR=URL-адрес	Адрес HTML-документа, который будет загружен изначально в данный фрейм.
NAME=имя_фрейма	Определяет имя фрейма, которое используют для ссылки к данному фрейму из другого фрейма.
MARGINWIDTH=значение	Определяет ширину полей фрейма слева и справа. Размер указывают в пикселях.
MARGINHEIGHT=значение	Определяет ширину полей фрейма сверху и снизу. Размер указывают в пикселях.
SCROLLING=значение	Отображение полос прокрутки. Возможны значения YES, NO, AUTO.
NORESIZE	Запрещает изменение размеров фрейма. Не требует никаких параметров.

<NOFRAME> - альтернативная информация для браузеров, которые не поддерживают фреймовую структуру HTML-документов. Браузеры с поддержкой фреймовой структуры проигнорируют всю информацию между этими тэгами. Закрывающий тэг обязателен.

Е сли необходимо создать вложенный фрейм, то вместо тэга FRAME создаем еще одну структуру FRAMESET и уже в ней описываем все необходимые фреймы.

Взаимодействие между фреймами заключается в возможности загрузки документов в выбранный фрейм по командам из другого фрейма. По умолчанию, если данный атрибут отсутствует, документ будет загружаться в текущий фрейм.

В документе, где описана структура фреймов, даем имя фрейма:

Например:

<frameset cols=130,*>

<frame src=fr2.html>

<frame src=fr3.html name=right>

</frameset>

В файле fr2.html, где находятся ссылки на другие документы, в тэг <A> добавляем атрибут TARGET. Этот атрибут может иметь следующие значения:

_blank – загружает указанный файл в новое окно;

_self – загружает указанный файл в тот же фрейм, из которого вызвана ссылка;

_top – загружает указанный файл в целое окно с разрушением фреймовой сетки.

Например:

<body>

<h1 align=center>Оглавление</h1>

<a href=links.html target=_top>Ссылки</a><br>

<a href=poems.html target=right>Стихи</a><br>

<a href=tabl.html target=_blank>Таблица</a><br>

</body>

В последнее время наблюдается отказ от использования фреймовой структуры в пользу использования механизмов CSS (Каскадные таблицы стилей).