Раньше изменение шрифта веб-страницы обычно означало вложение соответствующего текста в тег <tag> и использование атрибутов для управления его цветом, размером и стилем. Сегодня этот подход больше не признается, поскольку он смешивает визуальный стиль с фактической разметкой контента. Сегодня мы рекомендуем метод концентрации информации о стиле шрифта в отдельном файле, который называется каскадной таблицей стилей (CSS).
Концентрация информации о шрифтах в одном файле CSS имеет множество очевидных преимуществ: с ним легко работать, он не требует специального программного обеспечения и одинаково работает в большинстве основных браузеров. Более того, поскольку информация централизована в одном месте, внешний вид веб-страницы легко изменить: вы можете просто изменить шрифт или цвет основной таблицы стилей, и изменения мгновенно «каскадятся» по всей вашей странице. сайт.
Звучит весело, правда? Поэтому, пожалуйста, читайте дальше, потому что в этой статье я расскажу о свойстве шрифта CSS, которое предназначено для замены старого элемента <font>. Если вам нужен централизованный контроль над шрифтом, цветом, размером текста и интервалом на вашей HTML-странице, это так. Мощный инструмент, которым можно воспользоваться.
тип управления
Атрибут шрифта определяет шрифт, используемый соответствующим элементом. Это свойство обычно содержит список названий шрифтов, разделенных запятыми; имена, содержащие пробелы, могут быть заключены в кавычки. При его применении браузер будет использовать первый шрифт, который он найдет в списке, или стандартный шрифт браузера по умолчанию, если действительный шрифт не найден.
Листинг A представляет собой пример применения этой инструкции:
Список А
<html> <голова> <style type="text/css"> .цитировать { семейство шрифтов: «Bookman Old Style», «Verdana»; } </стиль> </голова> <тело> <div class="quote">Быть или не быть, вот в чем вопрос.</div> </тело> </html> |
На рисунке A показан результат.
Рисунок А
Font_family
Важно помнить, что эта директива очень зависит от шрифтов, отображаемых клиентской системой; в приведенном выше примере, если система не отображает шрифты Bookman Old Style и Verdana, будет использоваться шрифт браузера по умолчанию. Чтобы избежать этой проблемы, лучше всего добавить список имен общих шрифтов, таких как с засечками, без засечек или курсив, после списка имен специальных шрифтов. Это указывает браузеру использовать наиболее подходящий шрифт в этом классе шрифтов; . Листинг B представляет собой переработанную версию приведенного выше примера, которая точно решает описанную выше проблему.
Список Б
<html> <голова> <style type="text/css"> .цитировать { семейство шрифтов: «Bookman Old Style», «Verdana», «курсив»; } </стиль> </голова> <тело> <div class="quote">Быть или не быть, вот в чем вопрос.</div> </тело> </html> |