Как можно корректно обрезать текст, чтоб несколько строк оставалось?

Как можно корректно обрезать текст, чтоб несколько строк оставалось?
  • Вопрос задан
  • 155 просмотров
Пригласить эксперта
Ответы на вопрос 1
PretorDH
@PretorDH
HTML5, CSS3, PHP, JS - люблю в чистом виде.
Вот посмотрите пример виджета с многострочной обрезкой.
JSfiddle

Самое главное правильно посчитать высоту строк. Это удобно делать в em.

Например: У вас есть стандартный шрифт в пикселях в документе установленый ТОЛЬКО один раз в теге html. Блоки разметки header, footer, aside, колонок и секций его не меняют. Шрифт меняется только внутренними элентами разметочных блоков.

Высоту блоков выставляете в em кратно line-height.

Меняете его только в единицах em/rem. И коректируете высоту line-height по формуле:
FSn / LHo = LHn,
где
FSn - новый font-size;
LHо - старый line-height;
LHn - новый line-height;

Кроме этого, если хотите чтобы верстка выглядела типографически верно (строки колонок совпадали на всей странице), нужно аккуратно соблюдать кратность отступов margin и padding к высоте строки.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
22 нояб. 2024, в 08:04
1 руб./за проект
22 нояб. 2024, в 06:06
1500 руб./в час
22 нояб. 2024, в 06:04
1 руб./за проект