Форматирование отдельных символов

Все текстовые редакторы, например Microsoft Word или поставляемый в составе Windows WordPad, позволяют менять начертание и размер шрифта текста, делать его жирным, курсивным или подчеркнутым, а также менять его цвет. Все это доступно и в Dreamweaver. Нужно только иметь в виду, что возможности HTML по форматированию текста сильно ограничены существующими стандартами.

Начнем с самого простого. Попытаемся сделать некоторые фрагменты текста нашей страницы жирными и курсивными. И помогут нам в этом две кнопки изменения начертания, показанные на рисунке 35.

Рисунок 35 Кнопки изменения начертания шрифта Соответственно, левая (В) кнопка позволяет сделать шрифт жирным, а правая (I) — курсивным. Обе эти кнопки могут быть нажаты или отжаты независимо, т. е. текст может быть простым, жирным, курсивом или жирным курсивом.

Выделим слова «Иван Иванович Иванов» и нажмем кнопку В. Текст станет жирным. Теперь выделим полностью последнюю строку (со сведениями об авторских правах) и нажмем кнопку I. Последняя строка станет курсивной. Полученный результат можно увидеть на рисунке 36[30].

Рисунок 36 Жирный текст и курсивная строка Вместо нажатия кнопки В можно выбрать пункт-выключатель Bold в подменю Style меню Text или контекстного меню. В том же подменю существует пункт Italic — аналог кнопки /. Также можно нажимать комбинации клавиш + и + соответственно.

А вот чтобы включить или вьючить подчеркивание текста линией, придется воспользоваться пунктом-выключателем Underline подменю Style меню Text или контекстного меню. Ни кнопки, ни комбинации клавиш для этого не предусмотрено.

Здесь все теги HTML, предназначенные для оформления текста, делятся на две большие группы. Теги физического форматирования просто говорят Web-обозревателю: «Сделай текст вот таким и не задавай лишних вопросов». Таким образом, если сделать текст жирным, то Web-обозреватель просто выведет его жирным шрифтом, не выполняя при этом никакой дополнительной обработки. Такие теги хороши тогда, когда не дает оформляемому с их помощью тексту никакого особого значения.

В отличие от них, теги логического форматирования дают тексту, составляющему их содержимое, какое-либо дополнительное значение. Например, можно превратить с помощью одного из этих тегов фрагмент текста в цитату. Web-обозреватель выведет ее особым шрифтом (как правило, курсивом, хотя, может и вообще никак не выделить) и, вместе с тем, может выполнить какую-то дополнительную обработку этого текста, например, вывести все цитаты, встретившиеся в странице, в отдельное окно. (Правда, ни один современный Web-обозреватель так не делает, но кто знает, что будет дальше…)[25].

Выделение текста жирным и курсивным шрифтом, рассмотренное выше, выполняется с помощью тегов физического форматирования. В самом деле, просто по-другому выделили некоторые фрагменты текста нашей странички, не давая им какого-то особого значения. И Web-обозреватель нас прекрасно поймет.

В подменю Style видно пункт-выключатель Strikethrough, включив который сделает выделенный фрагмент текста зачеркнутым. Зачеркивание текста выполняется опять же с помощью тега физического форматирования, А остальные пункты подменю Style задают именно логическое форматирование. В таблице 1 приведены все эти пункты и их краткие описания, а на рисунке 37 — примеры текста, отформатированные с использованием соответствующих пунктов этого подменю[23].

Таблица 1

Пункты логического форматирования подменю Style

Рисунок 37 Примеры различного форматирования текста с помощью пунктов подменю Style

В таблице 2 перечислены теги, вставляемые в HTML-код пунктами подменю Style.

Таблица 2

Теги, вставляемые в HTML-код пунктами подменю Style

Можно задать шрифт, которым набран наш текст. Делается это с помощью двух раскрывающих списков, расположенных в редакторе свойств. Разумеется, Dreamweaver предоставляет в ваше распоряжение также соответствующие пункты меню и комбинации клавиш. Для смены шрифта используется раскрывающийся список, показанный на рисунок 38, а для смены размера шрифта— список, показанный на рисунок 39. Но для того, чтобы понять, что же там отображается, нужно дать некоторые разъяснения.

Рисунок 38 Раскрывающийся список смены шрифта.

Рисунок 39 Раскрывающийся список задания размера шрифта.