Pull to refresh

Таблица значений отступов от букв до верха и низа строки

Reading time1 min
Views1.5K
Предлагаю вашему вниманию таблицу значений отступов от букв до верха и низа строки, для стандартного значения line-height.
Эта таблица нужна для точного определения padding или margin обрамляющего или близлежащих элементов.

Вот картинка-легенда, чтобы было понятно о чем речь:
легенда


Со временем самые популярные комбинации запоминаются и не нужно каждый раз смотреть значение.

Простой пример:

пример
  1. Заголовок у нас набран шрифтом Tahoma, размером 24px. Смотрим таблицу, расстояние от верха маленькой буквы, до верха строки — 11px.
  2. Далее, с помощью линейки, измеряем значение от верха маленькой буквы, до верхней границы блока — 33px.
  3. Находим разность значений, получаем 22px. Значит, верхний padding блока равен 22px.
  4. Или, если для body у нас задан размер шрифта 75%, то верхний padding будет равен 22/12=1.833em.

Включает в себя значения для шрифтов, размером от 8px до 50px:
  • Arial
  • Tahoma
  • Verdana
  • Arial Narrow
  • Trebuchet MS
  • Georgia
  • Times New Roman

Таблица тут

P.S. Да, я знаю, что теперь есть Pixel Perfect.
Tags:
Hubs:
Total votes 58: ↑48 and ↓10+38
Comments47

Articles