Posted by: fxix on: Август 27, 2008
1.
-шрифт\гарнитура не задана:
-font-size:16px;\ гарнитура не задана:
-font-size:100%;\ гарнитура не задана:
-гарнитура font-family:”Times New Roman”, Times, serif;\ шрифт не задан:
h1 — 21px -большие, 14px -маленькие. фон 37px.
h2 —16px -большие, 11px -маленькие. фон 27px.
h3 —12px -большие, 9px -маленькие. фон 23px.
h4 —11px -большие,7px -маленькие. фон 20px.
h5 —9px -большие,6px -маленькие. фон 16px.
h6 —8px -большие,5px -маленькие. фон 13px.
просто текст —11px -большие,7px -маленькие. фон 19px.
p —11px -большие,7px -маленькие. фон 20px.
a —11px -большие,7px -маленькие (линия – на 2px вниз). фон 19px.
ширина\высота дива -1em=16px по замеру;
Т.е. если в body задаем размер шрифта – 1em/16px/100% то получаем высоту фона 19px, высоту больших букв 11px, высоту маленьких букв 7px. Если в body задаем размер шрифта 0.5em то получаем высоту фона 10px, высоту больших букв 6px, высоту маленьких букв 4px. Если в body задаем {font-size:62.5%;} то простой текст – размер фона – 12px, большие буквы -7px, маленькие -5px.
2.
-гарнитура font-family:Arial, Helvetica, sans-serif;\ шрифт не задан
h1 — 23px -большие, 17px -маленькие. фон 38px.
h2 —17px -большие, 13px -маленькие. фон 30px.
h3 —14px -большие, 11px -маленькие. фон 23px.
h4 —12px -большие,9px -маленькие. фон 20px.
h5 —10px -большие,7px -маленькие. фон 16px.
h6 —8px -большие,6px -маленькие. фон 14px.
просто текст —12px -большие,9px -маленькие. фон 18px.
p —12px -большие,9px -маленькие. фон 19px.
a —12px -большие,9px -маленькие (линия – на 2px вниз). фон 18px.
1em=16px;
3. Когда размер шрифта НИГДЕ не задан явно(ни размер ни гарнитура)
Когда body{font-size:16px;} (гарнитуру не пишем)
Когда body{font-size:100%;} (гарнитуру не пишем)
Когда размер шрифта html{font-size:100%;} (гарнитуру не пишем)
Когда размер шрифта html{font-size:16px;} (гарнитуру не пишем)
=высота текста 11px, пропорции 5px/4px и высота контейнера 20px
-сверху до текста 5 px, снизу до текста 4px.
4. Виды шрифтов
Шрифтами с засечками (serif) являются гарнитуры антиквенных групп, это серифные шрифты — гарнитуры Times New Roman, Century, Georgia, Garamond..
Шрифты без засечек (sans serif) – рубленные, гротески – - Arial, Arial Narrow, Arial Black, Verdana, Tahoma, Impact, Trebuchet
5. Вид записи тэга font:
p { font: 12px/10px sans-serif; }
Из типографики пошла запись указывать через слэш размер шрифта и межстрочное расстояние (интерлиньяж). Поэтому 12px в данном случае означает размер основного текста в пунктах, а 10px — интерлиньяж. В качестве семейства указывается рубленый шрифт (sans-serif).
p { font: bold italic 110% serif; }
Аргумент bold устанавливает жирное начертание текста, а italic — курсивное. В данном случае порядок этих значений не важен, поэтому их можно поменять местами. Размер текста задается в процентах, а в качестве гарнитуры используется шрифт с засечками (serif).
p { font: normal small-caps 12px/14px fantasy; }
Значение small-caps принадлежит параметру font-variant и устанавливает текст в виде капители (заглавные буквы уменьшенного размера). Аргумент normal применяется сразу к двум свойствам: font-style и font-weight.
Синтаксис
font: [font-style || font-variant || font-weight] font-size [/line-height] font-family
font-family – семейство шрифта
Если в имени шрифта содержатся пробелы, например, Trebuchet MS, оно должно заключаться в одинарные или двойные кавычки.
font-family: 'Times New Roman', Times, serif;
Когда браузер встречает первый шрифт в списке, он проверяет его наличие на компьютере пользователя. Если такого шрифта нет, берется следующее имя из списка и также анализируется на присутствие. Поэтому несколько шрифтов увеличивает вероятность, что хотя бы один из них будет обнаружен на клиентском компьютере. Заканчивают список обычно ключевым словом, которое описывает тип шрифта — serif, sans-serif, cursive, fantasy или monospace. Таким образом, последовательность шрифтов лучше начинать с экзотических типов и заканчивать обобщенным именем, которое задает вид начертания.
Синтаксис
font-family: имя шрифта [, имя шрифта[, ...]]
Аргументы
Любое количество имен шрифтов разделенных запятыми. Универсальные семейства шрифтов:
Синтаксис
font-weight: bold | bolder | lighter | normal | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900.
Насыщенность шрифта задается с помощью ключевых слов: bold — полужирное, bolder — жирное; lighter — светлое, normal — нормальное начертание. Также допустимо использовать условные единицы от 100 до 900.
Все свойства:
font-family
font-size
font-style
font-variant
font-weight
6.CSS3 свойства шрифтов.
font-stretch – задает обычный, сжатый или разреженный шрифт. В отличие от свойства font-weight, которое управляет весом шрифта, данное свойство изменяет ширину отдельных символов. Либо сужает, либо расширяет отображаемые символы. Для данного свойства предусмотрено девять именованных значений: ultra-condensed, extra-condensed, condensed, semi-condensed, normal, semi-expanded, expanded, extra-expanded и ultra-expanded (они представлены в порядке возрастания ширины символов).
font-size-adjust – Данное свойство эффективно дополняет font-size, устраняя проблему, которая состоит в следующем: выбор одинаковых размеров шрифтов не означает, что размеры символов будут совпадать. Символы Courier, Times Roman и Helvetica размером 12 пунктов занимают на экране различные области. Причина такого эффекта кроется в различных коэффициентах сжатия (они вычисляются как частное от деления размера шрифта на х-высоту). Если шрифты, для которых указан одинаковый размер в пунктах, могут занимать на экране разные по величине области, то символы шрифтов с одинаковым коэффициентом сжатия будут иметь при выводе на экран одинаковые размеры. Свойство font-size-adjust позволяет авторам Web-страниц задавать коэффициенты сжатия для шрифтов на Web-странице так, чтобы их реальные размеры при выводе на экран совпадали. Может принимать числовое значение, определяющее коэффициент сжатия; кроме того, для него предусмотрены именованное значение nоnе, которое не сохраняет коэффициент сжатия для шрифтов, и именованное значение inherit, которое приводит к наследованию значения данного свойства у родительского элемента. Обычно при увеличении коэффициента сжатия шрифт становится более удобочитаемым. Для вычисления требуемого коэффициента сжатия используется следующая формула:
у(а/а’) = с,где у — размер для выбранного шрифта; а — коэффициент сжатия целевого шрифта; а’ — коэффициент сжатия доступного шрифта; с — размер, который должен быть установлен для доступного шрифта.
Если запрашиваемый шрифт не найден, выбирается наиболее подходящий шрифт и свойство font- size- adjust устанавливает коэффициент сжатия запрашиваемого шрифта для того шрифта, который доступен в системе. При этом выбранный шрифт будет отображаться так же разборчиво, как и тот шрифт, который был предусмотрен автором документа. Приведенный ниже фрагмент кода демонстрирует общий принцип использования данного свойства.
‹hl style="f ont-size: 12pt; font-family: courier,- font-size-adjust: 1.5;"›Font-Size-Adjusted Header‹/hl›
В данном случае запрашивается шрифт из семейства Courier. Если он отсутствует в системе, выбирается наиболее подходящий из доступных шрифтов и посредством свойства font-size-adjust для выбранного шрифта устанавливается значение, равное 1,5.