- •Система адресации
- •Ip-адрес
- •Ip-адрес: 01111011110010000011001001100100
- •Адрес url
- •Сервисы Интернета
- •Общие сведения о языке html
- •Теги html
- •Структура документа html
- •Функциональные разделы документа
- •Создание списков
- •Создание таблиц
- •Задание 1. Ввод текста
- •Задание 2. Создание списков
- •Задание 3. Формирование таблиц
- •Гипертекстовые ссылки и якоря
- •Рисунки наWeb-страницах
- •Управление стилем шрифта
- •Форматирование фраз
- •Задание 1.Изменение оформления документа
- •Задание 2. Изменение оформления фрагментов документа
- •Задание 3. Создание гиперссылок
- •Задание 4. Использование графики
- •5. Создание фреймов
- •6. Использование фреймов
Структура документа html
Документ HTML состоит из основного текста и тегов. По сути, документ HTML представляет собой текстовый файл и для его создания можно использовать обычный текстовый редактор, например, Блокнот.
Документы HTML имеют строго заданную структуру, должны начинаться с тега <HTML> и заканчиваться закрывающим тегом </HTML>. Эта пара тегов сообщает браузеру, что перед ним действительно документ HTML.
Документ HTML состоит из раздела заголовков и тела документа. Раздел заголовков заключён между тегами <HEAD> и </HEAD> и содержит информацию о документе в целом. В частности, этот раздел должен содержать теги <TITLE> и </TITLE>, между которыми размещают заголовок документа. Браузеры используют этот заголовок, чтобы заполнить строку заголовка окна браузера.
Основной текст располагается в теле документа, которое задаётся тегами <BODY> и </BODY>. Для изменения фона документа используется атрибут BGCOLOR, а для задания цвета шрифта применяется атрибут TEXT. В качестве значений этих атрибутов используется символьная константа цвета или шестнадцатеричное число, формирующее цвет по схеме «красный-зелёный-синий».
Четыре перечисленных парных тега определяют основную структуру документа HTML. Они встречаются или их наличие подразумевается во всех документах HTML.
Фактически определить расположение основных структурных тегов можно и при их отсутствии. Поэтому, если теги <HTML>, <HEAD>, <BODY> и соответствующие им закрывающие теги опущены, то программа-браузер сама определит то место, где они должны находиться. Тег <TITLE> считается обязательным, но и его пропуск не вызовет катастрофических последствий. Однако при создании Web-страниц опускать эти теги не рекомендуется, так как неизвестно, как поведёт себя браузер, установленный на компьютере пользователя.
Парные теги влияют на часть документа между открывающим и закрывающим тегами. Такую часть документа рассматривают как элемент языка HTML. Например, элемент BODY включает в себя открывающий тег <BODY>, основное содержание элемента и закрывающий тег </BODY>. Элементы языка HTML делятся на блочные и текстовые. Блочные элементы относятся к частям текста уровня абзаца. Текстовые элементы описывают свойства отдельных фраз и более мелких частей текста. При создании документа HTML желательно придерживаться следующих правил вложения элементов:
элементы не должны пересекаться. Если открывающий тег находится внутри элемента, то и закрывающий тег должен располагаться внутри этого же элемента;
блочные элементы могут содержать вложенные блочные и текстовые элементы;
текстовые элементы могут содержать вложенные текстовые элементы;
текстовые элементы не могут содержать вложенные блочные элементы.
Пример 1
<html>
<head>
<title>Заголовок документа</title>
</head>
<body>
Этот текст можно прочитать на экране
</body>
</html>
Функциональные разделы документа
Язык HTML предназначен для описания функциональных разделов документа. Во многих обычных документах основными функциональными разделами являются заголовки и абзацы.
Язык HTML поддерживает шесть уровней внутренних заголовков документа. Они помечаются тегами от <H1> и </H1> до <H6> и </H6>. На экране компьютера эти заголовки изображаются шрифтами разных размеров. В соответствии с идеологией языка HTML текст, который по сути является заголовком, надо пометить с помощью одного из этих тегов. Пользоваться тегами форматирования, которые изменяют размер и начертание шрифта, в данном случае не следует.
Для обозначения обычных абзацев используют тег <P> и соответственно закрывающий тег </P>. Теги, описывающие обычные абзацы являются необязательными, но при их наличии браузеры чётко отслеживают границы между абзацами.
Для улучшения читаемости текста между абзацами браузеры выводят пустую строку. Эффективным средством создания разделителей в тексте являются горизонтальные полоски (линейки), визуально разделяющие документ на части. Горизонтальная линейка создаётся тегом <HR>. Это одиночный тег, не имеющий парного.
При создании HTML документа следует учитывать, что кратные пробелы между словами и переходы на новую строку при воспроизведении документа браузером игнорируются.
Для перехода на новую строку без создания абзаца используется тег <BR>.
Пример 2
<html>
<head>
<title>Функциональные разделы документа</title>
</head>
<body>
<h1>Главный заголовок</h1>
<h2>Подзаголовок</h2>
<p>Эти строки отображаются слитно,
несмотря на то, что в документе
они отделены
друг от друга.</p>
<p>Закрывающий тег абзаца не обязателен.<p>Тег начала абзаца более важен, чем реальный переход на новую строку.
<hr>
Текст после горизонтальной линейки<br>разбит на две строки
</body>
</html>