Em против Px и кросс-браузерная совместимость
Я новичок в CSS, и мне было интересно, есть ли преимущество в использовании em вместо px, когда речь идет о кросс-браузерной совместимости моего CSS.
4 ответа
Строго говоря, использование em поверх px на самом деле не является проблемой совместимости между браузерами - все браузеры поддерживают использование их обоих для определения размера шрифта.
Раньше было желательно избегать использования px для определения размера шрифта, так как браузер с самой большой долей рынка, IE6, не позволял изменять размер текста. Он видит px как абсолютное значение, а не как относительное значение, как em, и поэтому не будет увеличивать или уменьшать размер текста в пикселях.
В зависимости от вашей аудитории вам может не потребоваться беспокоиться об этом. Здесь есть отличная информация о преимуществах EM и о том, как они могут помочь в создании гибкого макета здесь: http://www.alistapart.com/articles/fluidgrids/
Да. Некоторые браузеры (-cough IE8 -cough) по-прежнему не масштабируют текст должным образом, когда он в пикселях. Они хорошо масштабируются, но изменение размера текста не дает результатов.
Ems более или менее гарантированно масштабируется, когда пользователь запрашивает его. Также ems можно использовать для кнопок навигации или полей, в которых размещается текст, который должен хорошо масштабироваться вместе с текстом - это не просто размер шрифта. Попробуйте разные варианты в нескольких браузерах, увеличивая и уменьшая текст, и посмотрите, какие результаты вы получите.
Я полагаю, что некоторые рекомендации, которые я выучил, когда впервые начал работать в Интернете, отошли на второй план, и одним из них является рекомендация по изменению размеров шрифтов с помощью px. Причина проста - все современные браузеры теперь очень четко графически масштабируют целые страницы, и, таким образом, размер текста как особенность браузера является спорным.
Проблема увеличения текста существует только в IE6 (вы можете увеличить IE8). Доля IE6 в мире составляет менее 10%. Те, кто "плохо видит", составляют около 2% населения США. Это означает, что попытка справиться с IE6 выгодна 0,2% пользователей в США. Если бы существовал браузер с долей 0,2%, мы бы все проигнорировали его.
Преимущество игнорирования "масштабируемого" размера шрифта в пользу px очень велико, поскольку его проще реализовать и понять. С одной стороны, менее вероятно, что на него влияют загадки каскада. Это особенно полезно в ситуациях, когда необходимо точно контролировать высоту, например, в строке меню.
Я только недавно начал удалять em и% с сайтов, которые я создаю в пользу px, так что могут быть ошибки, которые я не затронул. Пока что я нахожу результат обнадеживающим.
Таким образом, я бы порекомендовал px не только для начинающих, но и в целом.
Размер EM можно изменить в некоторых старых браузерах (включая IE 6), а в PX - нет. Но, откровенно говоря, люди, имеющие доступ, должны иметь возможность изменять размер шрифта, используя более современные браузеры.
Для новичка CSS придерживайтесь PX. ЭМ может вызывать боль, так как они текучие, и вы можете иметь некоторые странные эффекты и не знаете, почему.
Прочитайте это для получения дополнительной информации о PX - EM -% - http://css-tricks.com/2580-css-font-size/
Надеюсь это поможет.