Вот и поговорим сегодня про «резиновую» задачу отступов и размеров шрифта. Варианта есть два: или использовать em, или ex. По сути, 1ex это высота символа «x» в нижнем регистре и на него распространяются абсолютно те же правила, что и на 1em. Пользуйтесь тем, что нравится. Главная причина, по которой данные единицы не заслужили широкой любви – отсутствие визуального ориентира. Мы легко можем представить себе разницу в шрифте между размерами 10px и 16px, не правда ли? А вот на сколько для визуального восприятия отличаются между собой шрифт в 0.625em и 1.25em, при том что 1em величина относительная, ответить сможет далеко не каждый.
Вот, собственно, мы и подошли к героям сегодняшней статьи – это два интернет ресурса: type-scale и modularscale. Первый позволяет подобрать шрифты исходя из «золотого сечения», а второй модульная линейка, при помощи которой можно значительно расширить свои представления об интервалах в вебе. Рассказывать о принципе работы этих сервисов я не буду, хоть они и англоязычные, но интерфейс интуитивно понятен, да и оптимизированы они исключительно как рабочие инструменты: никакой рекламы и лишнего текста. Помимо всего прочего type-scale забирает шрифты напрямую из базы Google Fonts – отличная копилка латиницы, причем все шрифты, там представленные, оптимизированы именно для веба. Загружаем понравившийся, немного экспериментируем с предложенными вариантами и забираем сгенерированный CSS.
