EM для высоты линии

Ответ 1

Предполагая, что "преобразование в ems" означает использование блока em для font-size, тогда вы должны установить line-height таким образом, который также адаптируется к размеру шрифта. Эти два свойства тесно связаны друг с другом, и если вы установите один из них в em, а другой (например,) в px или pt, тогда страница сломается, если размер шрифта изменится. Таким образом, это противоречило бы идее "использования ems" для использования существенно разных единиц для существенно связанных свойств.

Например, если вы установите font-size: 1.5em и line-height: 18px, тогда все будет зависеть от размера шрифта родительских элементов и может сильно ошибиться, если этот размер намного меньше или намного больше, чем ожидалось.

Если вы используете блок em или чистый номер, это другая проблема. Использование только числа, как и в line-height: 1.2, в основном эквивалентно использованию блока em, как в line-height: 1.2em. Но есть разница, что когда line-height наследуется, это чистое число, которое наследуется, а не вычисленное значение.

Например, если внутренний элемент имеет в два раза больше размера шрифта его родителя, то унаследованное значение 1.2 означает, что в 1.2 раза используется его собственный размер шрифта, который в порядке. Но если у родителя был line-height: 1.2em, тогда ребенок наследовал бы значение, которое в 1.2 раза превышало бы размер шрифта родителей - это намного меньше его собственного размера шрифта.

для получения более подробных примеров объяснений см. line-height @Mozilla Developer Network

Ответ 2

line-height может быть установлен в px, em, каждый блок будет соответствовать.

line-height работает лучше всего и в будущем, если вы используете коэффициент/множитель, а не единицу, а только число, умножающее размер шрифта.

.foo {
  font-size: 1.3em; /* based that 1em == 10px */
  line-height: 1.3; /* 16.9px line-height */
}

Итак, да, вы можете ответить на вопрос: нет, не стоит.

просто переходите к тому, чтобы основанная на коэффициенте линия-высота была будущим доказательством.

Ответ 3

Рекомендуется использовать безразмерный номер для высоты линии (чтобы предотвратить проблемы наследования). Вычисленная длина строки будет продуктом безразмерного значения, умноженным на размер шрифта элемента.

Может быть удобнее использовать ярлык font CSS, например (пример, взятый из документов Mozilla CSS):

div { font: 10pt/1.2  Georgia,"Bitstream Charter",serif }

Хороший пример того, почему безразмерное значение является предпочтительным, приведен здесь: Предпочитать единичные номера для значений высоты строки.

Ответ 4

вы можете попробовать line-height:1.3 !important;