HTML допускает два подхода к шрифтовому выделению фрагментов текста. С одной стороны, можно прямо указать, что шрифт на некотором участке текста должен быть жирным или наклонным, то есть изменить физический стиль текста. С другой стороны, можно пометить некоторый фрагмент текста как имеющий некоторый отличный от нормального логический стиль, оставив интерпретацию этого стиля браузеру. Поясним это на примерах.

Физические стили

Под физическом стилем принято понимать прямое указание браузеру на модификацию текущего шрифта. Например, все, что находится между метками  и , будет написано жирным шрифтом. Текст между метками  и  будет написан наклонным шрифтом.

Несколько особняком стоит пара меток <TT> и </TT>. Текст, размещенный между этими метками, будет написан шрифтом, имитирующим пишущую машинку, то есть имеющим фиксированную ширину символа.

Логические стили

При использовании логических стилей автор документа не может знать заранее, что увидит на экране читатель. Разные браузеры толкуют одни и те же метки логических стилей по-разному. Некоторые браузеры игнорируют некоторые метки вообще и показывают нормальный текст вместо выделенного логическим стилем. Вот самые распространенные логические стили.

... 

От английского emphasis — акцент.

... 

От английского strong emphasis — сильный акцент.

<CODE>... </CODE>

Рекомендуется использовать для фрагментов исходных текстов.

<SAMP>... </SAMP>

От английского sample — образец. Рекомендуется использовать для демонстрации образцов сообщений, выводимых на экран программами.

<KBD>... </KBD>

От английского keyboard — клавиатура. Рекомендуется использовать для указания того, что нужно ввести с клавиатуры.

<VAR>... </VAR>

От английского variable — переменная. Рекомендуется использовать для написания имен переменных.

Пример

Подытожим наши знания о логических и физических стилях.

<html> <head> <title>Пример 5</title> </head> <body> <H1>Шрифтовое выделение фрагментов текста</H1> Теперь мы знаем, что фрагменты текста можно выделять жирным или наклонным шрифтом. Кроме того, можно включать в текст фрагменты с фиксированной шириной символа <TT>(имитация пишущей машинки)</TT> Кроме того, существует ряд логических стилей: EM - от английского emphasis - акцент STRONG - от английского strong emphasis - сильный акцент <CODE>CODE - для фрагментов исходных текстов</CODE> <SAMP>SAMP - от английского sample - образец </SAMP> <KBD>KBD - от английского keyboard - клавиатура</KBD> <VAR>VAR - от английского variable - переменная </VAR> </body> </html>

Ненумерованные списки: <UL>... </UL>

Текст, расположенный между метками <UL> и </UL>, воспринимается как ненумерованный список. Каждый новый элемент списка следует начинать с метки <LI>. Например, чтобы создать вот такой список:

§ Пара 1

§ Пара 2

§ Пара 3

необходим вот такой HTML-текст:

Обратите внимание: у метки <LI> нет парной закрывающей метки.

Нумерованные списки: <OL>... </OL>

Нумерованные списки устроены точно так же, как ненумерованные, только вместо символов, выделяющих новый элемент, используются цифры. Если слегка модифицировать наш предыдущий пример:

Списки определений: <DL>... </DL>

Список определений несколько отличается от других видов списков. Вместо меток <LI> в списках определений используются метки <DT> (от английского definition term — определяемый термин) и <DD> (от английского definition definition — определение определения). Разберем это на примере. Допустим, у нас имеется следующий фрагмент HTML-текста:

<DL> <DT>HTML <DD>Термин HTML (HyperText Markup Language) означает 'язык маркировки гипертекстов'. Первую версию HTML разработал сотрудник Европейской лаборатории физики элементарных частиц Тим Бернерс-Ли. <DT>HTML-документ <DD>Текстовый файл с расширением *.html </DL>

Обратите внимание: точно так же, как метки <LI>, метки <DT> и <DD> не имеют парных закрывающих меток.

Если определяемые термины достаточно коротки, можно использовать модифицированную открывающую метку <DL COMPACT>. Например, вот такой фрагмент HTML-текста:

<DL COMPACT> <DT>А <DD>Первая буква алфавита <DT>Б <DD>Вторая буква алфавита <DT>В <DD>Третья буква алфавита </DL>

Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями: