Должен ли я использовать пиксели, em или ни один?

Question

Я пытаюсь получить окончательный ответ на что-то в css. Я пытаюсь понять, должен ли я использовать

line-height: 1.5; 

или

line-height: 1.5em; 

или

line-height: 15px; 

Несколько сайтов говорят не указывать em или px. Итак, на этой ноте, я должен сказать что-то вроде:

margin: 10px; 

или

margin: 10em; 

Что вы думаете?

Answer 1

Очевидно, это зависит от многих факторов.

Как правило, используйте em для всего, что связано с текстом, и px для всего, что связано с украшением. Таким образом, заполнение и границы должны быть px, размер текста, ширина, высота и т. Д. Должны быть em или% (или, еще лучше, жидкостная компоновка).

Только представьте, что вы используете большой текстовый дисплей; какие элементы будут вы хотите быть больше? Создание границ больше, скорее всего, оставляет меньше места для текста, поэтому было бы действительно отрицательным.

Для линейной высоты вы не должны использовать единицы (или em, но это пустая трата 2 символов); это доля размера шрифта. Если вы использовали px, вы могли бы получить высоту линии, которая меньше, чем текст, то есть bad.

Этот сайт поднимает интересный момент о безразличии против em: http://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/. Идея заключается в том, что использование em будет устанавливать фиксированную высоту линии для всех детей, даже если размер шрифта отличается, тогда как использование единицы не будет использовать высоту строки, которая всегда относится к размеру шрифта. В большинстве случаев это было бы предпочтительнее, но я могу думать о ситуациях, когда вы тоже захотите, чтобы они были прежними.

Answer 2

Эм позволяет вашему сайту быть эластичным, поэтому iit изменяет размеры на основе размера экрана, однако, если вы действительно хотите, чтобы это хорошо работало, используйте EM для ВСЕХ ваших измерений на странице. Я считаю, что я использую EM для большинства своих макетов.

Answer 3

Единичные номера предпочтительнее конкретно для line-height, поскольку другие устройства могут иметь проблемы с наследованием, как описано в документе MDN line-height docs.

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

Answer 4

Насколько это возможно, не используйте px при определении поля. Используйте относительные единицы, такие как em или % потому что это reflowable макет. Мы всегда должны представлять и рассматривать, как выглядит макет на небольших устройствах и с измененным текстом.

• для вертикального текста краев (рентабельность-топ или край дно) использует СЭМ в это зависит от размера шрифта

• Для горизонтальных ширинов использовать%

• В полях рядом с левым границы, мы могли бы использовать px, если оно меньше 50px.

• Убедитесь, что все изображения завернутые в DIV/фигурный элемента с IMG установлен на 100% и высоту в автоматический режим

• изображений с размерами ландшафта рекомендуется устанавливать на 50% ширины и всплывать влево или вправо

• изображений с размерами портрета рекомендуется быть установлен на 33% ширины и поплыл либо влево или вправо