Для форматирования текста HTML-документа предусмотрена целая группа элементов, которую условно можно разделить на элементы логического и физического форматирования.
Элементы логического форматирования обозначают (своими именами) структурные типы своих текстовых фрагментов, такие, например, как программный код (элемент <code>), цитата (элемент <cite>), аббревиатура (элемент <abbr>) и т.д. С помощью элементов <em> и <strong> можно, например, отметить отдельные фрагменты как выделенные, или сильно выделенные. Заметим, что речь идет о структурной разметке, которая не влияет на конкретное экранное представление фрагмента браузером. Поэтому такая разметка и называется логической. Фрагменты с логическим форматированием браузеры отображают на экране определенным образом, заданным по умолчанию. Вид отображения никак не связан со структурным типом фрагмента (т. е. именем элемента логического форматирования), но может быть легко переопределен.
Элементы физического форматирования определяют формат отображения указанного в них фрагмента текста в окне браузера (согласно предпочтениям автора документа). Например, для отображения фрагмента курсивом можно использовать тэг курсива <i>.
Между разработчиками НТМL-документов долгое время шли споры о преимуществах и недостатках того или иного подхода. С выходом спецификации НТМL 4.0 эти споры завершились в пользу применения логического форматирования, поскольку был провозглашен принцип отделения структуры документа от его представления. Действительно, только на базе логического форматирования можно гибко управлять представлением документа, используя современные методы (основанные на таблицах стилей, динамически изменяющихся документах и т. д.)
Тем не менее, на настоящий момент может свободно использоваться и физическое форматирование. В спецификации HTML 4.0 некоторые элементы физического форматирования не рекомендуются для применения, однако, пока они все еще поддерживаются всеми браузерами. Заметим, что некоторые элементы логического форматирования, призванные заменить отдельные элементы физического форматирования, распознаются не всеми браузерами, что делает их применение крайне неудобным. Примером может служить логический элемент <del>, который рекомендуется использовать вместо физического элемента <strike>.
5.1. Элементы логического форматирования.
5.1.1. Элемент <abbr>.
Элемент <abbr> отмечает свой текст как аббревиатуру (abbreviation).
5.1.2. Элемент <acronym>.
Так же, как и элемент <abbr>, используется для отметки аббревиатур. Этим элементом рекомендуется отмечать так называемые акронимы, т. е. произносимые слова, состоящие из аббревиатур. Элемент <acronym> возможно в будущем станет использоваться для невизуального отображения элементов, например при речевом синтезе.
Данный элемент удобно использовать в сочетании с атрибутом title, в качестве значения которого можно указать полную форму записи аббревиатуры. Тогда визуальные браузеры при наведении курсора на текст, размеченный элементом <acronym>, будут выдавать полное наименование в виде появляющейся подсказки.
<acronym title="Санкт-Петербургский государственный институт точной механики и оптики"> СПбГИTMO </acronym> - один из ведущих технических вузов Санкт-Петербурга
5.1.3. Элемент <cite>.
Элемент <cite> используется для отметки цитат или названий книг и статей, ссылок на другие источники и т. д. Браузерами такой текст обычно выводится курсивом. Пример:
<cite>Невское время</cite> является одной из наиболее популярных городских газет Санкт-Петербурга
5.1.4. Элемент <code>.
Элемент <code> отмечает свой текст как небольшой фрагмент программного кода. Как правило, отображается моноширинным шрифтом. Этот элемент не следует путать с элементом <pre>, являющимся элементом уровня блока, который следует использовать для отметки больших фрагментов (листингов) кода.
Например:
Пример простейшего оператора языка программирования C:<br>
<code>puts("Hello, World!");</code>
5.1.5. Элемент <del>.
Элемент <del> отмечает свой текст как удаленный. Этот элемент полезно использовать для отметки изменений, вносимых в документ от версии к версии. Элемент <del> может использоваться как элемент уровня текста и как элемент уровня блока.
Элемент имеет два необязательных атрибута: cite и datetime. Значение атрибута cite должно представлять собой URL-адрес документа, поясняющего причины удаления данного фрагмента.
Атрибут datetime указывает дату удаления в формате: YYYY-MM-DDThh:mm:ssTZD, определяющем год, месяц, число, часы, минуты и секунды удаления, а также часовой пояс (Time Zone). Например:
Последней принятой спецификацией языка разметки HTML является версия <del datetime=1999-10-29T16:12:53+0.00>3.2</del> 4.0
Текст, помеченный элементом <del> обычно отображается перечеркнутым текстом. В спецификации HTML 4.0 этому элементу отдается предпочтение перед элементом физического форматирования <strike> или <s>, обозначающих перечеркнутый текст.
5.1.6. Элемент <dfn>.
Элемент <dfn> отмечает свой текстовый фрагмент как определение (definition). Например, этим элементом можно отметить какой-либо термин, когда он встречается в тексте в первый раз. Пример:
<dfn>Internet Explorer</dfn> - это популярный Web-браузер
5.1.7. Элемент <ins>.
Элемент <ins> отмечает свой текст как вставку (insertion). Этот элемент полезно использовать для отметки изменений, вносимых в документ от версии к версии. Элемент <ins> может использоваться как элемент уровня текста и как элемент уровня блока.
Элемент имеет два необязательных атрибута: cite и datetime. Значение атрибута cite должно представлять собой URL-адрес документа, поясняющего подробности внесенных дополнений.
Параметр datetime указывает дату вставки в формате: YYYY-MM-DDThh:mm:ssTZD, определяющем год, месяц, число, часы, минуты и секунды вставки, а также часовой пояс (Time Zone).
Текст, помеченный элементом <ins>, обычно отображается подчеркнутым текстом.
5.1.8. Элемент <em>.
Тэг <em> (emphasis — выделение, подчеркивание) используется для выделения важных фрагментов текста. Браузеры обычно отображают такой текст курсивом. Пример:
Пример выделения <em>отдельных слов</em> текста
Применение данного элемента предпочтительнее применения элемента физического форматирования <i>.
5.1.9. Элемент <kbd>.
Элемент <kbd> отмечает текст как вводимый пользователем с клавиатуры. Обычно отображается моношириггым шрифтом, например:
Чтобы запустить текстовой редактор, напечатайте: <kbd>notepad</kbd>
Применение данного элемента предпочтительнее применения элемента физического форматирования <tt>.
5.1.10. Элемент <q>.
Элемент <q> отмечает короткие цитаты в строке текста. В отличие от элемента уровня блока <blockquote> при отображении не выполняется отделение размеченного текста пустыми строками. Обычно отображается курсивом.
5.1.11. Элемент <samp>.
Элемент <samp> отмечает текст как образец (sample). Обычное использование этого элемента — отметка текста, выдаваемого программой (sample output). Используется также для выделения нескольких символов моноширинным шрифтом.
Применение данного элемента предпочтительнее применения элемента физического форматирования <tt>. Например:
В результате работы программы будет напечатано: <samp>Hello, World!</samp>
5.1.12. Элемент <strong>.
Элемент <strong>, как правило, используется для выделения важных фрагментов текста. Браузеры обычно отображают такой текст полужирным шрифтом. Пример:
Санкт-Петербург расположен в самой восточной оконечности <strong>Финского залива</strong> в устье реки <strong>Невы</strong>
Применение данного элемента предпочтительнее применения элемента физического форматарования <b>. Элементом <strong> обычно размечают более важные фрагменты текста, чем те, что размечены элементом <em>.
5.1.13. Элемент <var>.
Элемент <var> отмечает имена переменных программ. Обычно такой текст отображается курсивом. Пример:
Задайте значение переменной <var>n</var>
5.2. Элементы физического форматирования.
Приведем описание элементов физического форматирования. Часть из них не рекомендуется к использованию спецификацией HTML 4.0 по приведеннным выше причинам. Некоторые элементы отменены (deprecate) спецификацией HTML 4.0, однако они продолжают поддерживаться браузерами.
5.2.1. Элемент <b>.
Элемент <b> отобоажает текст полужирным шрифтом. В большинстве случаев рекомендуется вместо элемента <b> использовать элемент логического форматирования <strong>. Пример:
Это <b>полужирный</b> шрифт.
5.2.2. Элемент <i>.
Элемент <i> отобоажает текст курсивом. Для большинства случаев вместо этого элемента рекомендуется использовать элементы <em>, <dfn>, <var> или <cite>, поскольку последние лучше отражают назначение выделяемого текста. Например:
Выделение <i>курсивом</i>
5.2.3. Элемент <tt>.
Элемент <tt> отображает текст моноширинным шрифтом. Для большинства случаев вместо этого элемента лучше использовать элементы <code>, <samp>или <kbd>. Пример:
Это <tt>моноширинный</tt> шрифт.
5.2.4. Элемент <u>.
Элемент <u> отображает текст подчеркнутым. Отмененный элемент. Вместо него рекомендуется использовать элементы <strong> или <cite>. Напимер:
Пример <u>подчеркивания</u> текста.
5.2.5. Элементы <strike> и <s>.
Элементы <strike> и <s> отображают текст, перечеркнутый горизонтальной линией. Отмененный элемент. Вместо него рекомендуется использовать элемент <del>. Например:
Пример <strike>зачеркнутого</strike> текста.
5.2.6. Элемент <big>.
Элемент <big> выводит текст шрифтом большего (чем непомеченная часть текста) размера. Вместо этого элемента лучше использовать элемент <strong>. Например:
Шрифт <big>большего</big> размера.
5.2.7. Элемент <small>.
Элемент <small> выводит текст шрифтом меньшего размера. Поскольку в HTML нет элемента, противоположного по действию элементу <em>, то для этих целей можно применять элемент <small>. Например:
Шрифт <small>меньшего</small> размера.
5.2.8. Элемент <sub>.
Элемент <sub> сдвигает текст ниже уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для математических индексов. Например:
Пример шрифта для <sub>нижнего</sub> индекса.
5.2.8. Элемент <sup>.
Элемент <sup> сдвигает текст выше уровня строки и выводит его (если возможно) шрифтом меньшего размера. Удобно использовать для задания степеней чисел в математике. Например:
Пример шрифта для <sub>верхнего</sub> индекса.
5.3. Элемент <font>.
Элемент <font> задает параметры шрифта. Он относится к элементам физического форматирования уровня текста.
Назначение параметров шрифта непосредственно в тексте документа нарушает основную идею разделения содержательной части документа и описания формы представления документа. Поэтому в спецификации HTML 4.0 данный элемент, а также элемент <basefont> отнесены к отмененным. Их дальнейшее применение не рекомендуется.
Атрибуты:
- face — указывает тип шрифта, которым браузер будет выводить текст. Если такого шрифта не будет найдено на компьютере пользователя, то данное указание будет проигнорировано и будет использован шрифт, установленный по умолчанию. Допускается использовать несколько названий шрифтов, разделяя их запятыми. Например:
<font face="Arial, Tahoma, Times New Roman"> - size — устанавливает размер шрифта в собстванных условных единицах от 1 до 7 (7 — самый крупный). По умолчанию используется значение
size="3", что обычно соответствует 12 пунктам. Поддерживается относительное изменение. Для этого перед значением атрибута ставится знак «плюс» (+) или «минус» (-). Например,size="+1"увеличит шрифт на одну единицу по сравнению с текущим размером,size="-2"— уменьшит на две единицы. - color — указывает цвет шрифта в системе RGB. Например:
<font color="#66CC00">
5.4. Элемент <basefont>.
Для задания базового шрифта сразу для всей страницы применяется элемент <basefont>. Обычно он указывается сразу после элемента <body>. Использование этого элемента не отменяет возможность изменения шрифта в любом месте.
Также как и элемент <font> — не рекомендуемый — и имеет те же атрибуты.