Брянский государственный технический университет
Кафедра: «Экономика, организация производства, управление»
Лабораторная работа №4
ЯЗЫК РАЗМЕТКИ HTML
По предмету:
«Сетевыеинформационные
технологии»
Выполнили:
Студентки гр.09-ЭК(б)
Лахтикова С.С.
Котова М.М.
Проверила:
Александрович Е. В.
2011 г.
Цель работы
Ознакомление с особенностями форматирования документов HTML и их отображения при помощи обозревателя InternetExplorer. Изучение разметки абзацев. Создание документа, содержащего гиперссылки, графику. Изучение атрибутов тега <IMG>. Ознакомиться с элементами языка HTML, которые могут использоваться для форматирования текста документа. Научиться создавать списки средствами языка HTML и определять способ их нумерации (маркировки). Ознакомиться с приемами создания таблиц средствами языка HTML для представления данных, создавать таблицы и изменять их вид при помощи атрибутов тегов HTML. Научиться отображать в рамках одной Web-страницы несколько документов при помощи фреймов.
Теоретические положения Создание страницы html
Все документы HTML имеют одну и ту же структуру, определяемую определенным набором тегов. Теговую модель можно представить в следующем виде: <имя элемента, список атрибутов> содержание элемента </имя элемента>.
Например, применим тег <P> (новый параграф в тексте):<P align=center>Это новый параграф</P> В рассмотренном примере
-
P — это имя тега;
-
align=center — атрибут тега, указывающий на то, что текст внутри параграфа необходимо разместить по центру;
-
Это новый параграф — содержание параграфа;
-
/P — закрывающий тег, указывающий на конец параграфа;
Гипертекстовая ссылка определяется при помощи парного тега <A>. Обязательным атрибутом является HREF=. В качестве значения атрибута используется адрес URL документа, на который указывает ссылка, ссылка может быть локальной.
Примеры:
-
<A HREF="http://www.eopu.tu-bryansk.ru"> Сайт кафедры ЭОПУ</A>
-
<A HREF="http://www.eopu.tu-bryansk.ru/index.html#point"> Ссылка на второй абзац внутри документа "ЭОПУ"</A>.
Для представления графики используют форматы файлов GIF и JPEG. Для вставки рисунка используется текстовый элемент, задаваемый непарным тегом <IMG>. Тег <IMG> должен содержать обязательный атрибут SCR=, задающий адрес URL файла с изображением.
Пример: <img SRC="http://www.tu-bryansk.ru /images/logo.gif">
Любой гипертекстовый документ состоит из двух частей: заголовка документа (HEAD) и тела документа (BODY)
<HTML> <HEAD>
<TITLE> Содержание заголовка </TITLE>
</HEAD> <BODY> Содержание тела документа
…………………………..
…………………………..
………………………….
</BODY> </HTML>
Редактирование страницы html
Парный тег <FONT> позволяет управлять параметрами шрифта. Он должен обязательно содержать хотя бы один из атрибутов:
-
COLOR=”шестнадцатеричный код цвета”,
-
FACE=гарнитура шрифта,
-
SIZE=размер от 1 до 7.
Элементы стиля
-
<I>.....</I>Курсив(Italic)
-
<B>...</B>Усиление(BOLD)
-
<TT>...</TT> Телетайп
-
<U>...</U>Подчеркивание
-
<S>...</S> Перечеркнутый текст
-
<BIG>...</BIG> Увеличенный текст
-
<SMALL>...</SMALL> Уменьшенный текст
-
<SUB>...</SUB>Подстрочные символы
-
<SUP>...</SUP>Надстрочные символы
Существуют списки трех видов:
-
упорядоченные (нумерованные),
-
неупорядоченные (ненумерованные),
-
списки определений.
Они создаются при помощи парных тегов:
<OL> для упорядоченного списка,
<UL> для неупорядоченного,
<LI> для элементов списка,
<DL> для списка определений,
<DD> для определений,
<DT> для определяемых терминов.
Таблицы используют для представления больших объемов текста, а также для точного размещения элементов страниц. Таблица в языке HTML задается при помощи парного тега <TABLE>. Она может содержать заголовок таблицы, определяемый тегом <CAPTION>, и строки таблицы, задаваемые при помощи парных тегов <TR>. Каждая строка таблицы содержит ячейки таблицы, которые могут относится к двум разным типам:
<TH> ячейки в заголовках таблиц,
<TD> обычные ячейки.
Язык HTML позволяет в рамках одной WEB-страницы отобразить несколько документов. Для этого страница должна быть разбита на несколько областей — фреймов. Тело документа <BODY> заменяется описанием фреймов, задаваемых парным тегом <FRAMESET>. Атрибуты: COLS= разбиение окна вертикально, ROWS= разбиение окна горизонтально.