Каковы плюсы и минусы, чтобы использовать единицу измерения em для ширины, высоты, отступов, полей, высоты строки в макетах с фиксированной шириной?

Question

в своих проектах я использую em для определения размера шрифта только с body {62.5%}?

с помощью этого метода я могу легко вычислить их значение.

Так каковы плюсы и минусы, если я использую единицу измерения размеров для ширины, высоты, отступов, полей, высоты строки, даже для встроенных изображений, а также шрифта для макетов с фиксированной шириной ?

Answer 1

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

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

Кроме того, с ними не так сложно работать. Определите базовый размер шрифта и высоту строки и примените его к вашему (после хорошего сброса, конечно). Затем измените его только для заголовков (у вас должно быть не более 6 заголовков) и для любого региона, где имеет смысл изменить размер шрифта (боковая панель или нижний колонтитул). Вы будете делать 3 или 4 вычисления, все будут счастливы:)

Answer 2

Хорошо, если вы понимаете, как работает em, вы можете делать практически все, что можете, например, с пикселями, но с немного большим расчетом.

На самом деле вы можете сделать больше, например, если у вас есть заголовок h1, вы можете указать высоту строки и нижнее поле в em, чтобы они всегда отражали размер шрифта этого заголовка. При увеличении размера шрифта заголовка вы также увеличиваете поля и высоту строки.

Это может использоваться, например, для создания динамического вертикального ритма .

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

Но в современных браузерах и если вы можете позволить себе не поддерживать behemonts, таких как IE6, вы можете использовать абсолютные единицы измерения и при этом получить полный масштаб страницы.

Answer 3

Em-sizing полезен для жидких макетов, но меньше для фиксированных макетов. Нельзя сказать, что это бесполезно, но фиксированную разметку проще настроить с помощью пикселей. Конечно, вы можете продолжать использовать ems для определения размера шрифта.

Answer 4

Самый большой недостаток - отступы и выравнивание текстовых блоков со шрифтами разных размеров с изменением размера. Трудно точно выстроить вещи - если это важно для вас (и так должно быть).