какой блок я должен использовать в CSS при разработке веб-страницы

Question

Я разработал более 10 сайтов, но у меня возникло сомнение: «Какую правильную единицу я должен использовать». Будь то px, em или%. Пожалуйста, направьте меня в правильном направлении

РЕДАКТИРОВАТЬ 1: ДЛЯ ПЛАНОВ (особенно для контейнеров)

Answer 1

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

Как правило:

Если вы работаете на экране:

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

Если вы работаете в печатных СМИ:

• Может быть, стоит избегать px (это не жесткое правило в любом случае), а все остальное - честная игра. Это действительно зависит от того, сколько контроля вы хотите.

Answer 2

Нет настоящих правдивых или неправильных, но, как правило:

• Для всего, что вы хотите определенного, фиксированного размера, используйте PX
• Для всего, что вы хотите масштабировать с размером шрифта, используйте EM
• Для всего, что вы хотите масштабировать до доступного пространства в окне / контейнере, используйте %

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

Answer 3

Если вы говорите о размере шрифта, то px и pt не идеальны.

Емс и проценты являются масштабируемыми, поэтому они намного более доступны - удобны для слабовидящих. Они также хорошо масштабируются для пользователей мобильных телефонов.

Устройства Px и Pt не масштабируются вверх для пользователей с ослабленным зрением и не уменьшаются для мобильных телефонов.

Если вы говорите о компоновке или контейнерах, то это зависит от типа конструкции, которую вы хотите - плавной или статической - и не обязательно "правильный" ответ.

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

Answer 4

Для схем фиксированной ширины

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

для line-height используйте значение без единиц измерения, например {line-height:1.2}

для типографских элементов используйте {font-size:62.5%) для body, затем используйте em для других элементов

в HTML для <img> всегда используйте ширину и высоту без единиц измерения.

Answer 5

Для гибкости и доступности я рекомендую использовать % для горизонтальных измерений (относительно экрана пользователя) и em для вертикальных измерений (относительно настройки шрифта пользователя).

Answer 6

Используйте нужную единицу измерения в определенном контексте.

Unit   Description
====================
%   percentage
in  inch
cm  centimeter
mm  millimeter
em  1em is equal to the current font size. 2em means 2 times the size of the current font. E.g., if an element is displayed with a font of 12 pt, then '2em' is 24 pt. The 'em' is a very useful unit in CSS, since it can adapt automatically to the font that the reader uses
ex  one ex is the x-height of a font (x-height is usually about half the font-size)
pt  point (1 pt is the same as 1/72 inch)
pc  pica (1 pc is the same as 12 points)
px  pixels (a dot on the computer screen)

источник: http://www.w3schools.com/css/css_units.asp