Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Методические указания по языку HTML.doc
Скачиваний:
2
Добавлен:
01.04.2025
Размер:
462.34 Кб
Скачать

Заголовок таблицы расположен над таблицей

A1

A2

A3

A4

S11

S12

S13

S14

S21

S22

S23

S24

S31

S32

S33

S34

S41

S42

S43

S44

<TABLE Border>

<CAPTION>Заголовок таблицы расположен над таблицей<CAPTION>

<TR>

<TH> А1 </TH> <TH> А2 </TH> <TH> А3 </TH> <TH> А4 </TH>

</TR>

<TR>

<TD> S11 </TD> <TD> S12 </TD> <TD> S13 </TD> <TD> S14 </TD>

</TR>

<TR>

<TD> S21 </TD> <TD> S22</TD> <TD> S23</TD> <TD> S24</TD>

</TR>

<TR>

<TD> S31 </TD> <TD> S32</TD> <TD> S33</TD> <TD> S34</TD>

</TR>

<TR>

<TD> S41 </TD> <TD> S42</TD> <TD> S43</TD> <TD> S44</TD>

</TR>

</TABLE>

Опишем стиль для таблицы, который должен быть помещён в заголовок документа.

<STYLE>

TABLE {background-color: White;

border-color: black;

color: Black;

cellspadding=”3”;

cellspacing=”0”;

frame=”hsides”;

border-top: solid 3px black;

border-bottom: solid 3px black;

rules=”cols”;

width: 100%;

}

TD { border-left: solid 1px black;

text-align: center;

border-right: solid 1px black;

}

</STYLE>

Упражнение 5.1. Создайте HTML-файл для раздела 2, в котором представьте информацию в виде колонок, как в газете.

Упражнение 5.2. Добавьте в стилевую таблицу форматирование свойств таблицы.

Практическое занятие №6 посвящено изучению и использованию кадров (фреймов)

Кадры HTML позволяют разбить страницу на независимые с прокруткой окна. Кадры во многом похожи на таблицы. В отличие от таблиц кадры не только организовывают данные, но и размещают их на экране дисплея в разных окнах, вводя данные в каждое окно из отдельного файла. Разбиение экрана на кадры даёт возможность то из них, которое содержит оглавление Web-сайта, оставлять на экране на всё время просмотра сайта и использовать для обращения к его разделам. Содержимое раздела появляется в другом кадре на экране. Отдельный кадр на экране может содержать данные о владельце сайта и его реквизиты для связи. Экран не должен быть перегружен кадрами, иначе он плохо воспринимается. На экране рекомендуется организовывать не более 4-6 кадров. В таблице 12 представлены тэги, используемые для разбиения страницы на кадры.

Таблица 12. Тэги кадра.

Тэги

Атрибут и его значения

Пояснение

<FRAMESET> </FRAMESET>

Контейнер тэга FRAMESET в файле HTML играет роль контейнера тэга BODY, т.е. все описываемые кадры должны быть помещены в этот контейнер. Естественно, что тэг BODY отсутствует в файле описания кадровой структуры документа.

Rows=”список”

Cols=”список”

Должен быть указан хотя бы один из атрибутов. В атрибуте Rows указывается разбиение экрана на части по аналогии разбиения таблицы на строки, а в атрибуте Cols – на столбцы. Списком задаётся размер части и количество частей. Один размер отделяется от другого в списке запятой. Размер задаётся числом пикселей, или процентов, или дробной частью. Если числа выражены в процентах, то размер всего экрана принимается за 100%, а сумма частей не должна превышать 100%, например: Rows=”20%,60%,20%”. Если размер выражен в дробных частях, то предполагается деление экрана на части кратные одной доли и эта доля обозначается звёздочкой, перед ней ставится число долей, приходящихся на часть, например: Cols=”2*,3*”. В примере экран делится на два столбца размером 2/5 и 3/5, а доля составляет 1/5 и обозначается звёздочкой.

<FRAME>

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

SRC=”URL”

URL-адрес содержимого кадра. Как правило – это HTML-файл, расположенный в том же каталоге, где находится файл, содержащий описание кадров.

Name=”имя_кадра”

Имя, которое присваивается кадру и используется в тэге «ссылка» (A) для показа содержимого ссылки в именованном кадре. Пример: если FRAME SRC="k1.htm" NAME="n1" , то A HREF="sd2.htm" TARGET="n1".

MARGINWIDTH="5"

Создает внутреннюю рамку на левой и правой границе кадра. Значение - в пикселях.

MARGINHEIGHT="5"

Создает внутреннюю рамку на верхней и нижней границе кадра. Значение - в пикселях.

SCROLLING="YES | NO | AUTO"

К кадру добавляются полосы прокрутки.

NORESIZE

Запрещает изменять размеры ваших кадров на странице.

Пример описания кадров страницы в соответствии с видом, представленным на рисунке 2.

F1

F2

F3

F4

Рис. 2. Макет страницы, разбитой на четыре кадра с именами: F1, F2, F3, F4.

<HTML>

<HEAD>

<TITLE> Пример описания кадров. </TITLE>

</HEAD>

<FRAMESET Rows=”10%,80%,10%”>

<FRAME Src=”1.html” Name=”F1” >

<FRAMESET Cols=”20%,80%”>

<FRAME Src=”2.html” Name=”F2” >

<FRAME Name=”F3” >

</FRAMESET>

<FRAME Src=”4.html” Name=”F4” >

</FRAMESET>

</HTML>

Упражнение 6.1. Спроектируйте макет экрана для выбранной темы.

Упражнение 6.2. Создайте HTML-файл, в котором опишите кадровую структуру, соответствующую макету экрана, разработанному для выбранной темы. Один из кадров определите для размещения содержания Web-сайта, причём этот кадр должен постоянно находиться на экране. В других кадрах информация будет появляться при вызове раздела на экран. Все кадры должны быть именованы.

Упражнение 6.3. Внесите атрибут Target=”имя_кадра” в ссылки, находящиеся в файле содержания, чтобы указать в каком кадре будет появляться раздел при вызове его на экран.