< к оглавлению

Ниже приводится подборка дескрипторов, ориентированных для работы с текстом. Я разместила их в таблицы, надеюсь, всё понятно. На всякий случай уточню, что "Текст1" - текст до дескриптора, "Текст2" - текст после дескриптора, "Подопытный Текст" - текст между тэгами исследуемого дескрипторами, между ними пробелы (в таблице заголовков чуточку по другому).

1. Заголовки

<h1> ... </h1>Текст1

Заголовок 1-го уровня

Текст2
<h2> ... </h2>Текст1

Заголовок 2-го уровня

Текст2
<h3> ... </h3>Текст1

Заголовок 3-го уровня

Текст2
<h4> ... </h4>Текст1

Заголовок 4-го уровня

Текст2
<h5> ... </h5>Текст1
Заголовок 5-го уровня
Текст2
<h6> ... </h6>Текст1
Заголовок 6-го уровня
Текст2
(h - от англ. heading - заголовок)

Текст1 <>Подопытный Текст Текст2

2a. Основные дескрипторы форматирования строчного текста

<b> ... </b> Текст1 Подопытный Текст Текст2 Полужирный шрифт. (от англ. bold - жирный (шрифт))
<i> ... </i> Текст1 Подопытный Текст Текст2 Курсив. (от англ. italic - курсив)
<u> ... </u> Текст1 Подопытный Текст Текст2 Подчёркнутый текст. (от англ. underline - подчёркивать)
<s> ... </s> Текст1 Подопытный Текст Текст2 Зачёркнутый текст. (от англ. strike through - зачёркивать)
<tt> ... </tt> Текст1 Подопытный Текст Текст2 Моноширинный шрифт, как на пишущей машинке. (от англ. teletype - телетайп)
<big> ... </big> Текст1 Подопытный Текст Текст2 Увеличение размера шрифта. (англ. big - большой)
<small> ... </small> Текст1 Подопытный Текст Текст2 Уменьшение размера шрифта. (англ. small - маленький)
<sup> ... </sup> Текст1 Подопытный Текст Текст2 Надстрочный текст (sup - предположу, что сокращение от superscript - надстрочный текст)
<sub> ... </sub> Текст1 Подопытный Текст Текст2 Подстрочный текст (sub - предположу, что сокращение от subscript - подстрочный текст)
<abbr title= "текст"> ... </abbr> Текст1 Подопытный Текст Текст2 Сокращение от abbreviation - англ. сокращение. Основное назначение дескриптора - обеспечить адекватную работу программ-переводчиков и озвучивающих программ. Кроме этого, при наведении курсора на фразу, заключённую между тэгами, появляется всплывающее окно с текстом, указанным в атрибуте title.
<font> ... </font> Текст1 Подопытный Текст Текст2 Сам по себе дескриптор ничего не делает, но использование атрибутов позволяет менять характеристика шрифта, к примеру, цвет. (англ. font - шрифт) (В данном примере дескриптор употреблён без атрибутов.)
<div> ... </div> Текст1
Подопытный Текст
Текст2
Дескриптор определяет блок текста, на котором действуют его атрибуты. К примеру, определённое форматирование.
<p> ... </p> Текст1

Подопытный Текст

Текст2
Так оформляется и выглядит обычный абзац. (от англ. paragraph - абзац)
<blockquote> ... </blockquote> Текст1
Подопытный Текст
Текст2
А вот так оформляется и выглядит цитата. (от англ. block - блок и quote - цитата)
<pre> ... </pre> Текст1
Подопыт-
	ный
	    Текст
Текст2
Предварительно отформатированный текст (preformatted text). Маяковский был бы в восторге. :)
<br> Текст до разделителя
Текст после разделителя
Простой переход на следующую строку (br - break - англ. разрыв).
<nobr> ... </nobr> = Пример ^ = Если текст окружён данным дескриптором, то браузер отображает его в виде одной непрерывной строки. Если длина строки превышает ширину рабочей области, то создаётся горизонтальная прокрутка. Данный дескриптор используется крайне редко.
<wbr> = Пример ^ = Обычно данный дескриптор ставится внутри дескриптора <nobr> ... </nobr>, он разрешает браузеру в случае необходимости разорвать строку в месте своей установки. (могу предположить, что wbr - сокращение от wrapping break)
<hr> Текст до черты
Текст после черты
Горизонтальная черта (hr - horizontal rule - англ. горизонтальный разделитель). Её атрибутах посвящена отдельная страничка
<!-- ... -- >   Комментарий. Браузер не обращает никакого внимания на то, что находится между данными дескрипторами.



2б. Вспомогательные и дублирующие дескрипторы форматирования текста

<strong> ... </strong> Текст1 Подопытный Текст Текст2 Привлечение внимания пользователя к отдельным словам в тексте. Обычно используется полужирное начертание. (от англ. strong - сильный, крепкий, твёрдый)
<em> ... </em> Текст1 Подопытный Текст Текст2 Акцентирование внимания на отдельных словах в тексте. Обычно используется курсив. (от англ. emphasis - особое внимание)
<code> ... </code> Текст1 Подопытный Текст Текст2 Используется для выделения программного кода. Обычно применяется моноширинный шрифт. (code - англ. код)
<var> ... </var> Текст1 Подопытный Текст Текст2 Выделение в программном коде переменных. Обычно отображается курсивом . (от англ. variable - переменная)
<samp> ... </samp> Текст1 Подопытный Текст Текст2 Запись символов буквенной последовательности. Обычно моноширинный шрифт. (от англ. sample - образец)
<kbd> ... </kbd> Текст1 Подопытный Текст Текст2 Используется для выделения текста, введённого пользователем. Обычно применяется моноширинный или полужирным шрифт. (от англ. keyboard - клавиатура)
<cite> ... </cite> Текст1 Подопытный Текст Текст2 Выделение цитат, ссылок и названий. Обычно применяется курсив. (от англ. citation - цитата)
<dfn> ... </dfn> Текст1 Подопытный Текст Текст2 Выделение определений. Обычно используется курсив. (от англ. definition - определение)
<del> ... </del> Текст1 Подопытный Текст Текст2 Выделение удалённого текста. Обычно используется перечёркивание. (от англ. delete - удалять)
<ins> ... </ins> Текст1 Подопытный Текст Текст2 Выделение вставленного текста. Обычно используется подчёркивание. (от англ. insert - вставлять)



Наиболее приведены наиболее распространённые атрибуты форматирования текста. Они могут употребляться не со всеми дескрипторами, поэтому приходится вкладывать дескрипторы друг в друга.

а) color="значение"

Задание цвета текста. Пример: <font color=blue>Образец синей надписи</font> - Образец синей надписи


б) align="значение"

Способы выравнивания текста.
left
Форматирование по левому краю. (Используется по умолчанию.)
center
Форматирование по центру.
right
Форматирование по правому краю.
justify
Форматирование по ширине. (Если до полного заполнения строки недостаёт небольшого количество пикселей, то расстояние между буквами немного увеличивается, так, чтобы последний символ на строке находился в самой крайне-правой позиции. Благодаря такому приёму заполняется вся ширина абзаца и те получаются ровными не только слева, но и справа. Как вы можете это видеть на данном примере, разве зря я столько писала?)



в) size="цифра"

Атрибут позволяет контролировать размер шрифта, обычно применяется с дескриптором <font> ... </font> Примеры:
<font size=2>Абра-Кадабра</font> - Абра-Кадабра
<font size=-2>Абра-Кадабра</font> - Абра-Кадабра
<font size=+2>Абра-Кадабра</font> - Абра-Кадабра



г) face="название_шрифа"

Атрибут отдаёт браузеру распоряжение отображать текст определённым шрифтом. Можно использовать список шрифтов, перечисленных через запятую, в этом случае будет применён первый имеющийся в распоряжении ОС. Как правило, применяется с дескриптором <font> ... </font> Примеры:
<font face="Comic Sans MS">Абра-Кадабра</font> - Абра-Кадабра
<font face="Courier, Courier New, monospace">Абра-Кадабра</font> - Абра-Кадабра

< к оглавлению