высота и стиль линии

Question

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

Edit: пример этой стилизованной кнопки, созданной из div с текстом внутри. Это никогда не будет многострочным. Так будет ли нужна высота строки по соображениям совместимости? или что-то, о чем я не знаю?

Спасибо!

Answer 1

height - вертикальное измерение контейнера.

line-height - расстояние от верхней части первой строки текста до верхней части второй.

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

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

Answer 2

Если вы оберните текст в div, дадите div высоту, и текст вырастет до 2 строк (возможно, из-за того, что он просматривается на небольшом экране, таком как телефон), тогда текст будет перекрываться с элементами ниже Это. С другой стороны, если вы дадите div высоту строки, а текст увеличится до 2 строк, div расширится (при условии, что вы также не даете div высоту).

Вот скрипка , демонстрирующая это.

Answer 3

высота = высота строки + верхняя часть + нижняя часть

Answer 4

Предполагается, что текст меньше контейнера:

Установка высоты строки в контейнере указывает минимальную высоту линейных блоков внутри него. Для 1 строки текста это приводит к тексту, вертикально центрированному внутри контейнера.

Если вы установите высоту для контейнера, контейнер будет расти вертикально, но текст внутри него будет начинаться с первой (верхней) строки внутри него.

Answer 5

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