Установка свойства font-family

В стандартной CSS-таблице предусмотрены следующие свойства, определяющие вид шрифта, используемого для отображения текста элемента:

· font-family;

· font-size;

· font-style;

· font-weight;

· font-variant.

Все эти свойства наследуются дочерними элементами.

Свойство font-family определяет имя шрифта (гарнитуру), используемого для отображения текста элемента. Например:

BOOK {font-family: Arial}

Можно задавать любое имя шрифта. (Имена шрифтов не являются ключевыми словами CSS.) Если браузер не может найти требуемый шрифт, он заменит его на другой доступный шрифт.

Если имя шрифта содержит пробелы, заключите название в кавычки, как в следующем примере:

BOOK {font-family: "Times New Roman"}

Можно расширить возможность выбора и привести несколько вариантов допустимых к использованию шрифтов в порядке приоритета, разделяя их запятыми. Например:

BOOK {font-family: Arial, Helvetica}

Если шрифт Arial недоступен, браузер использует шрифт Helvetica. Если шрифт Helvetica также недоступен, он заменит его на какой-либо другой имеющийся шрифт.

Можно еще больше расширить возможность выбора нужного шрифта, включив в описание ключевое слово CSS - обычно в конце списка -указывающее на общий тип шрифта, который нужно использовать. Например:

BOOK {font-family: Arial, Helvetica, sans-serif}

В этом случае, если браузер не найдет шрифтов Arial или Helvetica, он использует какой-либо другой шрифт без засечек (sans-serif).

Установка свойства font-size

Свойство font-size устанавливает высоту шрифта, используемого для отображения текста элемента. Этому свойству можно присваивать четыре различных типа значений.

· Значение, задающее размер относительно размера шрифта браузера. Вы можете задать размер шрифта относительно текущего размера шрифта браузера, присвоив свойству font-size одно из значений в виде ключевых слов, представленных в таблице 7.2. Для Internet Explorer 5 значение small заставит браузер использовать текущий выбранный размер шрифта; другие значения масштабируются с увеличением или уменьшением относительно этого размера.

Таблица 5.1

Задание размера шрифта относительно размера шрифта браузера

Спецификация CSS рекомендует использовать масштабный коэффициент 1,5. Однако в Internet Explorer реальное соотношение между различными значениями размера отличается в меньшей степени. Например, medium в действительности составляет примерно 1,15 от small.

· Значение, задающее размер относительно размера родительского шрифта. Можно задать размер шрифта относительно текущего размера шрифта для родительского элемента, присвоив свойству font-size одно из следующих значений с помощью ключевых слов из таблицы 5.2.

Таблица 5.2

Задание размера шрифта относительно размера родительского шрифта

Значения 33 % и 50 %, приведенные в таблице, основаны на масштабном коэффициенте 1,5, рекомендованном спецификацией CSS. В действительности результат может оказаться иным.

· Задание размера в процентах от размера родительского шрифта. Вместо того, чтобы использовать ключевые слова smaller или larger, можно задать размер шрифта в процентах относительно текущего размера шрифта родительского элемента с большей степенью точности, задав свойству font-size значение в процентах. Например, следующее правило устанавливает размер шрифта, в полтора раза больше, чем размер шрифта родительского элемента:

TITLE {font-size: 150%}

(Если браузер использует рекомендуемый масштабный коэффициент 1,5, это правило будет эквивалентно правилу TITLE {font-size: larger}.)

Следующее правило устанавливает размер шрифта немного больше, чем установленный предыдущим правилом:

TITLE {font-size: 160%}

Заметим, что для корневого элемента проценты берутся относительно размера шрифта браузера. (Более подробная информация содержится па вставке «Задание значений в процентах».)

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

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

SECTION {line-height: 200%}

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

PARAGRAPH {font-size: 75%}

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

· Задание численных значений размера. Можно также задать размер шрифта для элемента, присвоив свойству font-size абсолютное значение. Например, следующее правило устанавливает размер шрифта в 12 пунктов:

TITLE {font-size:12pt}

А это правило устанавливает размер шрифта в два раза больше, чем размер шрифта родительского элемента:

TITLE (font-size:2 em}

(Этот пример эквивалентен записи TITLE {font-size:200%}.)

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

Абсолютное значение размера определяет точный размер с использованием стандартных единиц измерения, таких как дюймы, пункты или миллиметры. В таблице 7.4 приведен список различных единиц измерения, которыми можно пользоваться. Для каждой единицы представлена аббревиатура, которую необходимо применить для указания единиц измерения в правиле. Здесь же даны эквивалентные значения в других единицах измерения.

Таблица 5.3