• О блоге

    Блог был задуман как сайт для дизайнеров и всех, кто изучает и интересуется компьютерной графикой.

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

    Уроки Blender 3d   Текстуры   Уроки Photoshop   3d max   html/css

 
 
В процессе
 
 

Опанасенко Сергей (sergey@opanasenko.com.ua / sadesign)
Выбор интерлиньяжа
1 марта 2010

2.2.1 Выбирайте интерлиньяж, который соответствует шрифту, тексту и формату набора

«Пространство по-вертикали членится иначе как горизонтальное. Вам нужно выбрать не только общую размерность (высоту колонки или страницы), но также и основную ритмическую единицу. Такой единицей является интерлиньяж, то есть расстояние от линии шрифта предыдущей строки до линии шрифта следующей.»

В механическом наборе между строками добавляется свинцовая полоска для регулирования интерлиньяжа. В css это регулируется с помощью свойства line-height. Например, тексту в 12 пунктов мы даем межстрочное расстояние плюс три единицы к размеру шрифта – 15 пунктов.
p { font-size: 12pt; line-height: 15pt }

Однако это плохой пример, поскольку межстрочное расстояние не должно указываться в абсолютных единицах. Если мы увеличим размер шрифта до 18, а межстрочный интервал останется равен 15, то не получим мы ничего хорошего.
Более лучшим подходом является использования уникального свойства css, когда ненулевое значение допускается без указания единицы измерения.
p { font-size: 12pt; line-height: 1.25 }

При этом высота линии будет равна 1.25 x 12 = 15 pt. Это более надежный метод в котором межстрочный интервал будет пропорционален размеру шрифта. Высота линии может быть указана в font:
p { font: 12pt/1.25 "Minion Pro", "Minion Web", serif }

Следует отметить, что для некоторых браузеров стоит подрегулировать межстрочное расстояние: Сафари, например, и ИЕ, тогда как в Camino и Огнелисе этого делать не нужно.

Текст для веб почти всегда нужно разрежать чуть более чем для печати – 1.3 или 1.5
В отличии от механического набора, где свинцовая подложка добавляется с одной стороны в цифровом наборе высота делиться пополам сверху и снизу.

Отрицательный интерлиньяж может быть выгодно использован для коротких (или рекламных) текстов.
.example { font-size: 1.5em; line-height: 0.85; text-indent: -0.5em }

Выбор
интерлиньяжа

             





4 комментария на “Выбор интерлиньяжа”

  1. Как по мне, лучше указывать проценты в единицах измерения для line-height.

    Например, line-height: 125%; вместо line-height: 1.25; Так как теряется восприятие величины.

  2. дивбайзеро, у меня воспринимается 1.3 как 100% ;)

  3. Zel:

    а если указывать в em ?

  4. 2 Zel, тебе домашнее задание, собрать на ЕМ и без указания величины и скрин в студию :-)

Оставить комментарий


    Перевод книги


    Скоро на сайте RenderMarket перевод книги Алекса Галузина
    «Создание игрового уровня за 11 дней»

В другом формате

Введите email для автоматического получения новых статей на почту:

Друзья и партнеры

sadesign — создание и поддержка
RenderStuff, бесплатная библиотека 3d полезностей
Умный блог
Система Orphus