Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
KIT_shpory.docx
Скачиваний:
7
Добавлен:
15.04.2019
Размер:
240.73 Кб
Скачать

23. Элементы структуры html- документа. Фреймы. Оформление блоков гипертекста. Примеры.

HTML-док-т предст-ет собой иерархически связан-й набор эл-тов. Вне завис-ти от содерж-я все правильно составленные HTML-док-ты имеют одну и ту же стр-ру:

<!doctype html public "html version">

<html>

<head> ... заголовок док-та, содержит доп-ю инфо о док-те

<title>назва-е док-та</title>

</head>

<body> ... тело док-та, содержит размеченный текст, отображ-ий содерж-е док-та

</body>

</html>

Кроме приведенной стр-ры простого гипертекстового док-та, соврем-е браузеры поддерж-ют фреймы(кадры) - не перекрывающиеся обл-ти окна браузера, в кот.возм-но одновр-ное отобр-е неск-ких док-тов. Web-страницы с кадрами исп-ют неск-ко файлов с HTML-док-ами. Пр.стр-ры кадрированного HTML-док-та:

<html>

<head>

<title>название документа</title>

</head>

<frameset cols="20%,80%">

<frame src="file1.htm" name="левый кадр">

<frame src="file2.htm" name="правый кадр">

</frameset>

<noframes> …часть док-та только для старых версий браузеров, не поддерж-х работу с кадрами

</noframes>

</html>

В этом примере страница содержит 2кадра (2столбца с ширинами 20% и 80% от ширины экрана), связ-х с файлами file1.htm, file2.htm (имена файлов задают знач-я атрибута SRC эл-та <FRAME>). Атрибут NAME опр-ет имя кадра для указания его в гиперссылках. Эл-т <NOFRAMES> служит для отобр-я инфои, кот.видна в браузерах, не поддерж-щих работу с кадрами.

Оформление блоков гипертекста: Для придания большей выразит-ти HTML-страницам примен-ся след-е теги и их закрывающие пары:

для исп-я жирного написания <B> и </B>

для исп-я наклонного написания <I> и </I>

для исп-я режима подчеркивания <U> и </U>

В текст HTML-страницы м.б.добавлены заголовки и подзаголовки (с ур-нем вложения до 6). Для этого примен-ся теги <H1>, <H2>, <H3>, <H4>, <H5>, <H6> с соответст-ми закрыв-ми тегами.

Для форматирования строк и абзацев исп-ют след-е теги:

<P> ... </P> - оформление отд-го абзаца;

<BR> - принудительный перевод строки;

<HR> - горизонт-я черта (разделитель);

<PRE> ... </PRE> - передача текста без доп-ого форматирования.

24. Таблицы и списки в html. Примеры.

Для оформления перечней в гипертексте определены три типа списков: без нумерации или (исп-ся <UL>), с нумерацией или (<OL>) и списки определений (<DL>).

Пример оформления ненум-го списка:

<LI> Первый элемент списка

<LI> Второй элемент списка

<LI> Последний элемент списка

</UL>

Тег <LI> отвечает за формирование элемента списка.

Списки определений формируются с помощью элемента <DL> и служат для создания глоссариев (словарей терминов) и индексов:

<DL>

<DT>Первый термин

<DD>Определение первого термина

<DT>Второй термин

<DD>Определение второго термина

</DL>

Тег <DD> отвечает за формирование элемента списка определений.

Совместно с механизмом ссылок перечни позволяют строить простые меню.

Таблица – расположенная на HTML-странице прямоугольная сетка строк и столбцов, в кот можно вводить разнообразную инф-цию, включая текст, числа, связи и даже изображения. Общий формат описания таблицы, включаемый в элемент <BODY>:

<TABLE> Контейнер таблицы

<CAPTION> Контейнер заголовка таблицы

Заголовок таблицы

</CAPTION>

<TR> Контейнер строки таблицы

<TH>Заголовок 1-го столбца</TH>

<TH>Заголовок 2-го столбца</TH>

. . .

</TR>

<TR>

<TD>Первая ячейка</TD> Контейнеры ячеек

<TD>Вторая ячейка</TD>

. . .

</TR>

</TABLE>

Чтобы показать в таблице рамку, применяют атрибут BORDER тега <TABLE>. Дополнительно задается заголовок таблицы - контейнер CAPTION:

<CAPTION ALIGN=выравнивание>Заголовок таблицы</CAPTION>

где параметр выравнивание принимает значения: TOP – по верху, BOTTOM– по низу.

В контейнер ячейки можно помещать не только текст, но и метки для форматирования текста (напр, <B> или <I>), списки, вложенные таблицы, а также изображения, например :

<TABLE>

<TR>

<TD>One

<TD><IMG SRC="picture.jpg" ALT=" ">

<TD><FONT SIZE=5>W<FONT SIZE=3>Three

</TR>

</TABLE>

Кроме этого, внутри тегов <TD> и <TH> можно осуществлять выравнивание с помощью атрибута ALIGN со значениями: LEFT (влево), RIGHT (вправо) или CENTER (центрировать). Кроме горизонтального выравнивания в клетках таблиц можно применять и вертикальное выравнивание текста. В этом случае в тегах <TD> и <TH> применяется атрибут VALIGN с выравниванием по верху (TOP), по низу (BOTTOM) и выравниванием по середине (MIDDLE).

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]