Стиль CSS - процент против em против px?

Прочитав несколько статей в Интернете, я немного запутался, когда использовать percent, em или px вместо div´s, input´s, font´s, buttons и так далее...

Для сайта, над которым я работаю, мы не хотим добавлять адаптивный дизайн, и, насколько я понимаю из разных статей, проценты — это то, что нужно для elements и div´s. Но тогда я запутался, потому что я думаю, что я должен иметь возможность получить адаптивный дизайн, даже если я использую px для макета, а затем устанавливаю другую ширину, высоту в px в зависимости от устройства/разрешения экрана...?

И есть ли наилучшая практика, когда что использовать? И не только для размера шрифта, но и для div´s и других элементов?


person Daniel    schedule 13.01.2013    source источник
comment
@AshBurlaczenko: Здесь обсуждаются вопросы веб-разработки, касающиеся кодирования HTML/CSS, причем [html][css] являются двумя главными тегами. Я сомневаюсь, что веб-мастера в любом случае примут вопросы HTML/CSS. Тем не менее, как вопрос наилучшей практики, это, похоже, не соответствует нашему формату вопросов и ответов.   -  person BoltClock    schedule 13.01.2013
comment
посмотрите эту замечательную статью РАЗМЕР ШРИФТА CSS: EM VS. ПХ VS. ПТ СР. ПРОЦЕНТ   -  person NullPoiиteя    schedule 13.01.2013
comment
Большое спасибо за ваши ответы! И мне жаль, что мой первый вопрос был не по теме... Мои извинения, и я постараюсь быть в теме для моего следующего вопроса!   -  person Daniel    schedule 14.01.2013
comment
Я не вижу, как этот вопрос не по теме.   -  person Crystal Miller    schedule 18.11.2014


Ответы (2)


Главное преимущество использования em в том, что его реальный размер зависит от настроек пользователя, а именно размера шрифта по умолчанию. Таким образом, пользователи, предпочитающие крупный шрифт, увеличивают это значение. Проценты создают своего рода статическую компоновку, даже если она гибкая по размеру, в сочетании с минимальной и максимальной высотой/шириной это может привести к приятным результатам. Если вы хотите иметь гибкую компоновку с колонками, чтобы был только один маленький экран, два на больших и максимум три, вам также придется использовать плавающие элементы в сочетании с (мин-/макс-) шириной/высотой.

В общем, я бы не начал с вопроса о лучшем устройстве, кроме того, я бы начал с базовой концепции того, как должен работать макет. Иногда оказывается, что использование javascript для всего макета является самым быстрым и надежным решением, однако используемая единица измерения зависит от вашей конкретной цели, и для этого вопроса в целом не существует «это лучшее решение», что это какое состояние.

Привет..

person philipp    schedule 13.01.2013

Насколько я мог понять, значения length в %, em, px, pt — это просто разные меры, которые вы должны применять, чтобы что-то делать в вашем макете CSS. Нет никаких правил их использования.

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

Что я могу сделать, так это рассказать вам основы, но вы, вероятно, уже знаете это: у вас будут некоторые абсолютные значения (cm, mm, in, pt, pc, px) и некоторые относительные значения (на основе текста: em, ex, ch, rem; на основе области просмотра: vw, vh, vmin, vmax). Относительные меры изменяются по мере изменения их «базы».

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

Удача!

person Alvaro Lourenço    schedule 13.01.2013