Font size 1em
Font size 12pt
Font size 16px
Font size 100%
Тест шрифтов в разных браузерах
Для тестирования была создана страница, очистив от неточностей которую, я получил интересные наблюдения.
Блок <DIV> в правой части страницы, является родителем для <P> заданных в разных единицах, размер шрифта 16px, при наведении размер меняется на 1em.
Дано
- Тестовой странице был указан <!DOCTYPE html> - т.е. HTML5.
- В тесте принимали участие браузеры: IE 9, Chrome 17, Firefox 11, Opera 11
- Системный шрифт win7 - 122%
Решение
- Обычно в браузерах значения по умолчанию для обычного (не моноширинного) шрифта: 1em = 12pt = 16px = 100% Times New Roman (serif);
- Однако Opera при установке настраивает размер шрифта по умолчанию в зависимосит от размера системного шрифта, обычно это "Мелкий" (100%),
но если пользователь указал другое значение, например "Средний" или "Крупный", то опера увеличит шрифт по умолчанию. (Это предположение не доказано на 100%, но многовероятно.)
К тому же польхователь может сам изменить значения по умолчанию.
- Значения em и % берутся от родительского объекта, как минимум это <BODY>, который в свою очередь наследует их от <HTML>, если не было явного указания, то берётся за основу шрифт браузера по умолчанию.
- pt и px постоянные величины, не зависят от настроек браузера и родительских элементов страницы.
Ответ
- Если вы собираетесь менять размер шрифта, обязательно начните с BODY (или HTML, хотя зачем, по правилам нельзя распологать видимые объекты за пределами BODY).
Шрифты остальных элементов изменятся вместе с ним, если не указать для них отдельно.
- Если вы хотите строгого указания шрифтов для всех браузеров, то укажите шрифт для BODY в pt или px, как вам удобней.
Пользователь легко может увеличить размер шрифта средствами браузера, а вы будете застрахованы от "расползания".
Постскриптум
Ребята из студии лебедева, судя по их ЦССки считают иначе, задают в боди 100% и в Опере я вижу огромные шрифты.