Языка разметки гипертекста 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 Значение для элемента пронумерованного списка (его номер). Все дальнейшие номера элементов списка будут отсчитываться от этого номера.

Наши рекомендации