07. Семейство шрифтов.
При использовании шрифтов надо иметь ввиду следующее. Следует выбирать шрифты не только исходя из тех, которые установлены на вашем компьютере, но и те, которые с большой долей вероятности, установлены на компьютерах наших пользователей.
Исходя из этого мы можем все популярные шрифты свести к трем большим группам (для наглядности отобразим текст ниже о шрифтах более крупным размером, кроме шрифтов sans-serif, в данном случае используем, наоборот, более мелкий шрифт):
Указанные 9 шрифтов и группы шрифтов и следует использовать для веб дизайна, за исключением совсем уж специфических задач, связанных со шрифтами.
Классы для указанных шрифтов, создаются следующим образом:
Логика в таком перечислении следующая. Если на компьютере пользователя не установлен первый шрифт из списка, то пробуется следующий. В крайнем случае, будет использован какой-нибудь шрифт из указанного семейства шрифтов. А если вообще нет никакого шрифта из семейства, то тогда используется шрифт, не относящийся к данному семейству.
Если название шрифта состоит из более чем одного слова, то название следует заключать в двойные кавычки.
Теперь созданные классы в файле стилей CSS мы можем использовать в нашем учебном тестовом примере.
css_007_001.html ← кликните, чтобы посмотреть, как выглядит пример на данном сайте...
css_007_001.zip ← скачайте пример, чтобы установить на свой сайт...
Если мы не указываем использование какого-либо шрифта или семейства шрифтов, то браузер отображает тексты в соответствии со своими встроенными стилями.
Исходя из этого мы можем все популярные шрифты свести к трем большим группам (для наглядности отобразим текст ниже о шрифтах более крупным размером, кроме шрифтов sans-serif, в данном случае используем, наоборот, более мелкий шрифт):
- serif - шрифты с засечками, из которых с большой долей вероятности на всех компьютерах с любой операционной системой имеются шрифты: "Times New Roman", "Georgia". Считается, что засечки на буквах позволяют лучше читать текст, т.к. глаз как бы цепляется за них, позволяя быстро угадывать буквы и слова. Скорее всего, это теория больше верна для напечатанных на бумагу текстов, а не для текстов, отображаемых на мониторах и им подобных устройствах.
- sans-serif - шрифты без засечек, из которых с большой долей вероятности на всех компьютерах с любой операционной системой имеются шрифты: "Verdana", "Geneva", "Arial", "Helvetica". Эти шрифты разумно использовать для текстов, отображаемых на маленьких мониторах, дисплеях мобильных телефонов и им подобных устройствах, или для информации, которую следует отобразить мелким шрифтом.
- monospace - моноширные шрифты (т.е. шрифты, у которых все символы имеют одинаковую ширину), из которых с большой долей вероятности на всех компьютерах с любой операционной системой имеются шрифты: "Courier New", "Courier", "Andale Mono". Эти шрифты обычно любят использовать программисты, т.к. именно на данных шрифтах удобно читать тексты программ и другую подобную информацию, например, с использованием псевдографики.
Классы для указанных шрифтов, создаются следующим образом:
.serif_1 { font-family: "Times New Roman", "Georgia", serif; } .sans_serif_1 { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; } .monospace_1 { font-family: "Courier New", "Courier", "Andale Mono", monospace; }
Если название шрифта состоит из более чем одного слова, то название следует заключать в двойные кавычки.
Теперь созданные классы в файле стилей CSS мы можем использовать в нашем учебном тестовом примере.
css_007_001.html ← кликните, чтобы посмотреть, как выглядит пример на данном сайте...
css_007_001.zip ← скачайте пример, чтобы установить на свой сайт...
Если мы не указываем использование какого-либо шрифта или семейства шрифтов, то браузер отображает тексты в соответствии со своими встроенными стилями.
***** Машина-Функционал для передвижения по страничкам курса CSS *****
Вы кликнули поясняющий рисунок, который показывает, как работает тот или иной функционал. Кликать эти рисунки не надо, нет смысла.
Эти рисунки надо просто смотреть, а тексты к ним читать. Кликать кнопки следует на самом функционале.
Эти рисунки надо просто смотреть, а тексты к ним читать. Кликать кнопки следует на самом функционале.