- •Лабораторная работа №2. Форматирование текста на Web-странице по образцу. Управление цветом
- •Форматирование текста.
- •1. Форматирование абзаца
- •2. Форматирование шрифта
- •2.1. Физические стили
- •Размер шрифта
- •2.2. Логические стили
- •3. Горизонтальные линии
- •4. Escape последовательности (символьные объекты)
- •5. Управление цветом
- •Цветовая гамма html-документа
- •Задания для самостоятельной работы
- •Контрольные вопросы
2. Форматирование шрифта
HTML допускает два подхода к шрифтовому выделению фрагментов текста – логическое и физическое форматирование.
В группу тегов логического форматирования входят теги, отображающие на экране монитора элементы документа, таким образом, как установлено по умолчанию в спецификации языка разметки HTML. Переопределить их параметры или свойства нельзя, за исключением ситуаций использования стилевых шаблонов CSS и обособления тегами физического форматирования. Результат действия разных тегов логического форматирования визуально может совпадать, ибо основное их предназначение заключается в логическом выделении отдельных элементов HTML.
Теги физического форматирования позволяют разработчику визуально изменять вид текста, делая его жирным или наклонным, варьируя его параметры и значения.
2.1. Физические стили
Под физическом стилем принято понимать прямое указание браузеру на модификацию текущего шрифта.
<B> </b>
Выделение текста полужирным шрифтом (от слова Bold),. Очень популярный элемент. Использование полужирного шрифта – прием, позаимствованный из текстовых редакторов.
Пример
Этот текст имеет обычное начертание – <В>, а этот будет выделен полужирным шрифтом </Ь>.
<I> </i>
Выделение текста курсивом (от слова Italic).
Пример
Этот текст имеет обычное начертание <I>, а этот выделен курсивом </i>.
<ТТ> </tt>
Элемент, обозначающий текст телетайпа (teletype). Его особенность заключается в использовании моноширинного шрифта, имитирующего пишущую машинку, то есть имеющего фиксированную ширину символа.
<STRIKE> </strike>
Элемент, создающий перечеркнутое начертание текста. В настоящее время его заменяют тегом: <DEL > </del>.
<U> </u>
Подчеркнутое начертание текста.
<SUB> </sub>
Элемент, создающий эффект нижнего индекса (subscript).
<SUP> </sup>
Элемент, создающий эффект верхнего индекса (superscript).
Пример.
Размер шрифта
<BASEFONT>
Элемент, определяющий базовый (основной) размер шрифта. Внутри элемента необходимо указать атрибут:
size = Базовый размер шрифта
Величина атрибута может лежать в пределах от 1 до 7. По умолчанию используется величина 3. Установка, выполняемая этим элементом, имеет значение для элемента FONT (см. ниже), который позволяет задавать относительный размер шрифта.
<FONT> </font>
Определение типа, размера и цвета шрифта. Все эти характеристики определяются при помощи соответствующих атрибутов.
Абсолютный размер шрифта задается при помощи атрибута size (размер):
size=Абсолютный размер шрифта
Этот атрибут может принимать значения от 1 до 7. В таблице показано несколько образцов надписей, выполненных шрифтами разного размера.
Пример.
Пример
<FONT size=3> Тише едешь – дальше будешь </font>
Размер шрифта может задаваться относительного базового:
size=+Число
size=-Чucлo
При назначении величины для size необходимо учитывать величину базового размера. Обе они в сумме должны соответствовать одному из абсолютных размеров. Так, для базового размера, равного 3, относительный размер может находиться в пределах от – 2 до + 4. Если величина выходит за допустимый предел, то используется или шрифт размера 7, или шрифт размера 1. На рис. 2. показаны надписи, выполненные шрифтами с заданным относительным размером.
Шрифт +4 Шрифт +3
Шрифт+2 Шрифт+1 Шрифт 0 Шрифт –1 Шрифт-2
При помощи относительных величин тоже можно получить семь градаций размера шрифта
Для элемента FONT можно использовать атрибут цвета:
со1ог="Цвет"
Название цвета задается либо числом, написанным в шестнадцатеричной системе, например, color="#ffoooo", либо просто его названием, написанным на английском языке, например, color="red".
Пример
<FONT color="blue"> Это шрифт синего цвета </font>
Атрибут face (вид) позволяет задавать тип шрифта:
face="Название шрифта"
Пример
Правда, есть одна проблема. Web-страницы просматривает множество людей, и нет гарантии, что у каждого из них окажется нужный шрифт. Если в системе не установлен шрифт точно с таким же названием, то браузер использует свой стандартный. Он имеет два назначенных по умолчанию шрифта: один пропорциональный, другой моноширинный.
Все эти атрибуты могут быть использованы совместно внутри тэга <font>.
Пример
<FONT face="Arial" size=3 color="blue" > Это шрифт arial размером 3, цвет синий </font>
Элемент FONT может с успехом заменять элементы заголовка Н1...Н6. Для последних, например, не предусмотрена возможность указания цвета букв.
Чтобы заголовок, созданный на основе элемента FONT, хорошо смотрелся, этот элемент необходимо комбинировать с другими: CENTER, В, I, Р и т. д.
<BIG> </big>
Этот тег используется, если необходимо выделить часть текста небольшим увеличением размера шрифта относительно остальных слов.
<SMALL> </small>
Этот тег используется, если необходимо выделить часть текста небольшим уменьшением размера шрифта относительно остальных слов.
