(Это «em» типографский термин, а не «em» тег HTML, если кто-то смущает.)
Фрэнк Шиарар
4
@Alison: ты не значит «Ни один - использование эм s»?
Алан Пирс
1
Целевая платформа? Очевидным был бы процент, но, к сожалению, поскольку большинство ваших графических ресурсов не будут хорошо масштабироваться, я бы порекомендовал пиксели
dvhh
Хмммм @Алан, ты можешь быть прав :—)
Арманд
Ответы:
11
Какой юнит вы используете, полностью зависит от того, чего вы хотите достичь. Единицы, наиболее часто используемые в веб-макетах:
px - абсолютный; один пиксель
pt - абсолютный; 1/72 дюйма, около 1,3 пикселя для экрана
em - относительно размера родительского шрифта; 1.0em = размер символа (ширина заглавной буквы M)
% - по отношению к родителю
Вы используете px для размеров, которые остаются постоянными, например, граница 1px.
Вы используете em для размеров, которые должны соответствовать размеру шрифта, например, поле 3.0em.
Вы используете% для размеров, которые должны занимать процент от родительского, например, 50% ширины.
Для макетов веб-страниц вы обычно используете либо пиксели, либо проценты, в зависимости от того, хотите ли вы использовать фиксированный (пиксельный) макет или изменяемый (в процентах) макет.
Немного задира: em - это ширина, а не высота заглавной буквы M в традиционной типографии. Не удивительно, что en - это ширина верхнего регистра N. Ex - это основанная на символах мера высоты.
Стэн Роджерс
@ Стэн Роджерс: Я никогда не говорил, что это высота буквы M в верхнем регистре, кто-то другой редактировал это в.
Guffa
Важно то, что предоставленная информация является настолько точной, насколько мы можем сделать это, а не кто ее туда поместил. (Я не могу редактировать ответы других пользователей, не относящихся к вики, поэтому комментарии - лучшее, что я могу сделать.)
Стэн Роджерс
Размер точки не является абсолютным, если вы не знаете точное разрешение устройства вывода и масштабный коэффициент, который установил пользователь (независимый от разрешения пользовательский интерфейс, XP «большие шрифты» и т. Д.). Кроме того, iPhone 4 имеет разрешение 326 т / д, что значительно больше
72 т / д
@JBRWilkinson: Это абсолютная мера для любого устройства. Это так же абсолютно, как единица px; размер пикселя также отличается для любого данного дисплея.
Гуффа
1
Я склонен использовать пиксели для объявлений ширины (которые обычно являются фиксированными), но em для высоты. Таким образом, макет изменяет размер по вертикали, но сохраняет горизонтальную согласованность.
Я использую относительные / пропорциональные размеры, когда это возможно. Я считаю, что это значительно облегчает внесение изменений в макеты позже. Кроме того, использование размера относительно родительского элемента означает, что изменение в родительском элементе легко просачивается вниз.
Традиционно, использование относительных размеров также позволяло страницам выглядеть правильно в различных разрешениях и было особенно полезно для масштабирования браузера или минимального размера шрифта. Но современные браузеры теперь очень хорошо справляются с изменением размера с помощью макетов, ориентированных на пиксели, и даже увеличивают изображения по мере необходимости. Поэтому стало менее важно использовать относительные размеры.
Ответы:
Какой юнит вы используете, полностью зависит от того, чего вы хотите достичь. Единицы, наиболее часто используемые в веб-макетах:
Вы используете px для размеров, которые остаются постоянными, например, граница 1px.
Вы используете em для размеров, которые должны соответствовать размеру шрифта, например, поле 3.0em.
Вы используете% для размеров, которые должны занимать процент от родительского, например, 50% ширины.
Для макетов веб-страниц вы обычно используете либо пиксели, либо проценты, в зависимости от того, хотите ли вы использовать фиксированный (пиксельный) макет или изменяемый (в процентах) макет.
источник
px; размер пикселя также отличается для любого данного дисплея.Я склонен использовать пиксели для объявлений ширины (которые обычно являются фиксированными), но em для высоты. Таким образом, макет изменяет размер по вертикали, но сохраняет горизонтальную согласованность.
источник
Я использую относительные / пропорциональные размеры, когда это возможно. Я считаю, что это значительно облегчает внесение изменений в макеты позже. Кроме того, использование размера относительно родительского элемента означает, что изменение в родительском элементе легко просачивается вниз.
Традиционно, использование относительных размеров также позволяло страницам выглядеть правильно в различных разрешениях и было особенно полезно для масштабирования браузера или минимального размера шрифта. Но современные браузеры теперь очень хорошо справляются с изменением размера с помощью макетов, ориентированных на пиксели, и даже увеличивают изображения по мере необходимости. Поэтому стало менее важно использовать относительные размеры.
источник