Языка разметки гипертекста HTML
Создание простого документа
Основой разработки веб-страниц является язык HTML (HyperText Markup Language – язык разметки гипертекстов).
Основной структурной единицей языка HTML является тег (от англ. Tag - дескриптор, маркер). Тег всегда заключен между скобками < > и имеет следующий вид:
<ТЕГ атрибут 1=ЗНАЧЕНИЕ ... атрибут N=ЗНАЧЕНИЕ>
Теги бывают одиночными и контейнерными. Контейнером называется пара: открывающий <ТЕГ> и закрывающий </ТЕГ>.
Открывающий тег служит для указания программе-браузеру начала какого-либо объекта или задания свойств объектов помещенных в контейнер. Закрывающий тег служит для указания программе-браузеру о конце объекта или окончания применения свойств, заданных в открывающем теге.
Атрибуты тега задают значения свойств данного объекта или объектов помещенных в контейнер.
Документ HTML начинается открывающим тегом <HTML> и заканчивается закрывающим тегом </HTML>. Между данной парой контейнерных тегов располагаются две другие основные части HTML документа: заголовок, заключенный в контейнер <HEAD>...</HEAD> и тело документа в контейнере <BODY>...</BODY> (содержание страницы). В разделе описания заголовка можно указать заглавие документа, для этого используется тэг <TITLE> ... </TITLE> (имя страницы).
Таким образом, структура простого HTML документа выглядит примерно так:
<HTML> {начало страницы}
<HEAD> {описание страницы, заголовка}
<TITLE> название </TITLE> {имя страницы}
</HEAD> {закрытый тэг описания заголовка}
<BODY> {содержание страницы}
текст
</BODY> {закрытый тэг описания страницы}
</HTML> {конец страницы}
Форматирование текста
<BODY> </BODY> - тег, определяющий границы тела документа.
Атрибуты:
BGCOLOR – определяет цвет фона документа. По умолчанию «White» (#FFFFFF).
TEXT – задает цвет текста для всей страницы. Цвет указывается в формате RGB или константами red, green, blue и т.п. По умолчанию «black» (#000000).
В таблице 1 приведены названия цветов, определенные в стандарте HTML 4 и соответствующие им RGB-коды. Отметим, что многие современные браузеры выходят за рамки стандартов и поддерживают гораздо больше названий цветов.
Таблица 1
Название | Код | Название | Код |
Aqua | #00FFFF | navy | #000080 |
Black | #000000 | olive | #808000 |
Blue | #0000FF | purple | #800080 |
Fuchsia | #FF00FF | red | #FF0000 |
Gray | #808080 | silver | #C0C0C0 |
Green | #008000 | teal | #008080 |
Lime | #00FF00 | white | #FFFFFF |
Maroon | #800000 | yellow | #FFFF00 |
<P> </P> - абзац
Атрибуты:
ALIGN – выравнивание. Возможные значения: RIGHT-выравнивание текста по правому краю; CENTER - по центру; LEFT - по левому краю; JUSTIFY – по ширине.
<Н1> </Н1>…<Н6> </Н6> - заголовки разного уровня (от первого до шестого).
Пример:
<H2 ALIGN = CENTER> Заголовок второго уровня с выравниванием по центру.
<НR> - горизонтальная линия
Атрибуты:
ALIGN – выравнивание.
WIDTH – длина линии в процентах от окна браузера или пикселях
SIZE – ширина линии в процентах от окна браузера или пикселях
COLOR – цвет линии.
Пример:
<HR ALIGN = CENTER WIDTH=50% SIZE=6 COLOR= RED>
Дополнительные возможности по форматированию:
<B> </B> - полужирный текст;
<I> </I> - курсивный текст;
<U> </U> - эффект подчёркивания;
<STRIKE> </ STRIKE >- эффект зачеркивания.
<FONT> </FONT> - используется для указания начертания шрифта в документе.
Атрибуты:
SIZE – размер шрифта.
COLOR – цвет шрифта.
FACE – гарнитура шрифта.
Пример:
<Р> <FONT FACE=”ARIAL” SIZE=4 COLOR=RED> Красная строка набрана шрифтом ARIAL 4 размера </FONT> </Р>
Создание списков
В HTML-документе существует четыре основных вида списков:
- нумерованный
- маркированный
- вложенные списки
- список определений
Фрагмент текста, представляющий список, заключается в тэги:
<OL> …. </OL> упорядоченный список (ordered list);
<UL> ….</UL> неупорядоченный список (unordered list);
< LI>….</LI> вложенные списки;
<DL>….</DL> список определений.
Список определений служит для создание списков типа «термин» - «описание». Каждый термин начинается тэгом <DT> , а описание - тэгом <DD>.
Каждый элемент списка заключается в тэги <LI> ….</LI> (от английского list item). При выводе на экран элементы списка имеют отступ и начинаются с новой строки.
Тэг <OL> может иметь параметры: <OL TYPE=A|a|I|i|1 START=n>
TYPE= определяет вид нумерации, START= задаёт начальное значение первого элемента списка (независимо от типа указывается цифрой).
TYPE=A – маркеры в виде прописных латинских букв;
TYPE=a – маркеры в виде строчных латинских букв;
TYPE=I – маркеры в виде больших римских цифр;
TYPE=i – маркеры в виде маленьких римских цифр;
TYPE=1 – маркеры в виде арабских цифр (по умолчанию).
Тэг <UL> может иметь параметр:
<UL TYPE=disc|circle|square>
Тип тэга <UL> определяет внешний вид маркера как вид по умолчанию (disc), круглый (circle) или квадратный (square).
Тэг <LI> может иметь параметры:
<OL TYPE=disc|circle|squade>
или <OL TYPE=A|a|I|i|1 VALUE=n>
TYPE Вид маркера (см. <UL>) или счетчика (см.OL)
VALUE=n Значение для элемента пронумерованного списка (его номер). Все дальнейшие номера элементов списка будут отсчитываться от этого номера.