Гарнитура (вид) и цвет шрифта
Здесь есть два способа. Второй будет описан позднее. Первый - используется тег <font>
с атрибутами face и color, соответственно:
шрифт Verdana <font face="Verdana">шрифт Verdana</font>
красный шрифт <font color="red">красный шрифт</font>
шрифт цвета MidnightBlue <font color="MidnightBlue">шрифт цвета MidnightBlue</font>
шрифт цвета MidnightBlue <font color="#191970">шрифт цвета MidnightBlue</font>
Цвет имеет название и цифровое значение, как видно в этом примере
(MidnightBlue=#191970). О цветах можно написать очень много, но я
остановлюсь на одной ссылке:
Подбор цвета. Для использования подходят web-safe и web-smart цвета.
Форматирование текста: использование тега <span> и атрибута style (1)
Тег <span> относится к выделяемому (форматируемому) фрагменту текста:
<span...>текст</span>. Сразу замечу, что аттрибуты
(свойства), работающие с тегом <span>, могут применяться также с
тегами <p> и <div>. Однако тег <p> применяется к
абзацу, что не всегда нам подходит (хотя при форматировании абзаца
рационально использовать именно его). Тег <div> можно применять
так же, как и <span> - это скорее дело вкуса. Он имеет более
широкую область применения и обладает рядом дополнительных возможностей.
Но это уже не относится к форматированию текста. Поэтому для
определённости остановимся на <span>.
Запись
<span>текст</span> лишена какого-либо смысла сама по себе.
Тег <span> предназначен для того, чтобы приписать тексту
какое-либо свойство. Вот их-то я сейчас попытаюсь перечислить в
более-менее логическом порядке.
Цвет шрифта
Цвет шрифта можно задать с помощью тега <font>, о чём говорилось выше. Теперь воспользуемся тегом <span> и атрибутом style:
красный шрифт - <span style="color:red">красный шрифт</span>
Точно так же можно задавать и цифровые значения цветов (подробнее о них см. выше.
Гарнитура (вид) шрифта
О способе задать гарнитуру (вид) шрифта с помощью тега <font> также шла речь прошлый раз.
Сейчас рассмотрим второй способ - с использованием конструкции
<span style="font-family:***">шрифт</span>
На место ***
необходимо подставить гарнитуру (вид) шрифта. Как правило, подставляют
название не определённого шрифта, а целого семейства шрифтов, например, Verdana, Times и др. Получаем:
шрифт Verdanaшрифт Times
Размер шрифта
Для указания размера шрифта используется конструкция
<span style="font-size:***">шрифт</span>
Размер
шрифта может задаваться различными способами. Пожалуй, самый наглядный и
простой - подставить вместо *** одно из следующих семи значений:
xx-large, x-large, large, medium, small, x-small, xx-small.
Результат:
очень-очень крупный шрифт
очень крупный шрифт
крупный шрифт
средний шрифт
мелкий шрифт
очень мелкий шрифт
очень-очень мелкий шрифт
Можно указывать размер шрифта способом, хорошо знакомым из Word - в пунктах (pt). 1 пункт равен 1⁄72 дюйма. Примеры:
12pt
36pt
Значения 12pt, 36pt в этих примерах подставляются на место *** в общей формуле <span style="font-size:***">шрифт</span>. Также можно использовать и пиксели:
шрифт 12px
шрифт 36px
Приведённые выше размеры являются абсолютными. Но размер шрифта можно задать и относительным образом - в процентах:
шрифт размера 150% от исходного
<spant style="font-size:150%">шрифт размера 150% от исходного</span>
или по отношению к ширине буквы "m" в исходном шрифте (соответствующая единица измерения называется em):
шрифт размера 1,5em от исходного
<span style="font-size:1,5em">шрифт размера 1,5em от исходного</span>
Вес (насыщенность) шрифта
Это - то, что можно задать с использованием простого тега <strong>
жирный текст
<strong>жирный текст</strong>
С помощью <font> это делается так:жирный шрифт
<span style="font-weight:bold">жирный шрифт</span>
Преимущество такого способа в том, что наряду со значением веса шрифта bold можно использовать также значения bolder и lighter, получая шрифт "разной жирности" (в данном случае речь идёт об относительных значениях). А по умолчанию используется значение normal - обычный шрифт.
Стиль шрифта
Kурсив можно получить как с использованием тега <em>, так и следующим способом:
курсив
<span style="font-style:italic">курсив</span>
Вместо font-style:italic можно написать font-style:oblique, и тогда должен получиться не курсив, а наклонный ("угловатый") шрифт. Но это не всегда работает.Капитель
Напоследок воспользуемся font-variant, чтобы сделать все буквы в нашем фрагменте текста прописными (такой вариант шрифта называется капителью):
капитель
<span style="font-variant:small-caps">капитель</span>
А вот - пример использования нескольких свойств сразу:
наш шрифт | <span style="color:green; font-family:Verdana; font-size:150%; font-weight:bold; font-style:italic; font-variant:small-caps">наш
шрифт</span> |