em vs px ... для мобильных браузеров

Question

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

, даже если мы не заботимся об IE 6, мы должны использовать em вместо px, если мы не создаем другой сайт для мобильных устройств, тот же сайт будет отображаться как на рабочем столе, так и на мобильных телефонах (iphone, blackberry, Windows Mobile, Opera Mini, андроид и т.д.?

Answer 1

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

Так что для этого типа браузера с использованием px не хуже, чем для обычного настольного браузера. Вы можете сделать это, если хотите, без серьезных проблем, но в обеих ситуациях em предпочтительнее для основного содержимого тела, если можно.

Answer 2

PX имеет фиксированный размер пикселя EM относительно размером шрифта

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

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

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

Answer 3

Пиксели фиксированы, один пиксель будет использовать одно и то же место как на мобильном телефоне, так и на любом дисплее. Ems относительны, они так называются, потому что они используют приблизительный размер прописной буквы «M».

Итак, да, вы должны использовать ems, так как они будут скорректированы в зависимости от экрана, и ваши шрифты, скорее всего, будут лучше соответствовать им.

Answer 4

Я рекомендую не использовать пиксельные точные схемы в целом и особенно при разработке для мобильных устройств. Причины просты:

• Вы имеете дело с устройствами с экранами от маленьких разрешений до 1920x1080 и не существует подхода «один размер подходит всем»; также подумайте, что ваши пользователи могут не знать, что функция масштабирования существует даже в своих браузерах.
• При разработке мобильных устройств имейте в виду, что не многие из них поддерживают широкий диапазон размеров шрифтов, поэтому вы не можете полагаться на пиксельные точные шрифты. Линейная высота вообще не поддерживается некоторыми мобильными браузерами. Таким образом, если ваш дизайн зависит от точности пикселя, скажем, строки меню, и вы создаете планку с высотой x пикселей, результат может выглядеть совершенно неправильно.

Книга Дэна Седерхольма «Пуленепробиваемый веб-дизайн» может быть не такой пулевой, как следует из названия, но это действительно хорошее начало для ответа на ваш вопрос/решения вашей проблемы.

Answer 5

Вы можете использовать этот трюк для преобразования шрифтов из пикселей в эм в вашем CSS:

body { 
    font-size: 62.5%; /* resets the page font size */ 
} 

Затем укажите ваши размеры шрифта, как это:

p { 
    font-size: 0.8em; /* equals 8px */ 
    font-size: 1.0em; /* equals 10px */ 
    font-size: 1.6em; /* equals 16px */ 
    font-size: 2.0em; /* equals 20px */ 
} 

И так далее. Затем вы можете конвертировать px в em для вашего макета в PXtoEm.com.

Answer 6

вы можете прочитать эту статью http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/