Принудительная высота линии до фиксированного значения - PullRequest
0 голосов
/ 25 ноября 2018

Есть ли способ строго применять высоту строки всего абзаца или div?

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

Общие проблемы связаны с верхними индексами или увеличенными частями текста, которые (более или менее успешно), где мы рассмотрели несколько других вопросов, касающихся SO:

Однако проблема этих решений заключается в том, что они являются частичными и исправляют только конкретные случаи.Я не хочу исправлять конкретные проблемы, я хочу убедиться, что у этих проблем вообще не будет шансов появиться.Я не могу быть заранее уверен, какие различные виды элементов могут появиться во всем тексте, поэтому я хочу убедиться, что строки остаются одинаковыми, и вместо этого, в случае проблем, исправляет конкретные случаи, когда мне нужна строка длярастут из-за некоторых элементов.

Таким образом, проблемы в предыдущих «решениях», в частности:

  1. <sup> решение тега требует ручной игры с несколькими размерами, пока оно не станет правильным.
  2. Второй поток действительно не решает проблему.Когда часть текста становится достаточно большой, комбинация display:inline-block;, overflow:hidden; и vertical-align:top; не подойдет - строка в конечном итоге увеличится.

Что я пробовал:

Короче, смотрите этот JSFiddle .

Я попытался применить все комбинации этих правил CSS:

  • display: inline-block;(или просто inline)
  • overflow: hidden;
  • vertical-align: top;
  • line-height: 1px;

Однако при изменении размера текста на большойдостаточно все еще заставляет линии становиться больше.А добавление изображений (например, графических смайликов, которые могут быть на 1 пиксель выше обычной высоты строки) приведет к тому, что линии снова станут больше.

Что я хочу:

  1. В идеале мне нужно решение, которое бы гарантировало, что эти проблемы вообще не появятся. Я не возражаю обрезать крупные элементы сверху / снизу или с обеих сторон;
  2. Если (1) невозможно, тогда мне нужен хотя бы способ выделения ичетко видеть каждую строку, где это происходит .Другими словами, если любая строка становится всего на 1 пиксель выше, мне нужно, чтобы она привлекла мое внимание, даже когда просто просматривал текст.
...