Преобразование px в em онлайн

Что такое Em?

В Википедии хорошо сказано: «Em - это единица измерения в области типографии, равная размеру текущего шрифта». Если ваш размер шрифта составляет 16 пикселей, то 1em = 16px

1. Базовый размер

   Введите базовый размер шрифта в px

   px

   
   

2. Конвертировать

   PX в EM

   px

   или EM в PX

   em

3. Преобразовать

   
   

4. Результат

Какая разница в размерах текста между PX, EM,%, PT?

Пиксели и точки являются статическими измерениями, но обычно используются в различных средах. Пиксели используются на экранах, потому что экраны измеряются в пикселях. Хотя точки можно использовать на экране, они являются стандартом печати, поскольку они являются фактором DPI .

Процент и EM с другой стороны являются относительными измерениями. Размер EM или процентной единицы зависит от его родителя. Если размер основного текста составляет 12 пикселей, то для текста, установленного на 120% или 1,2 EM внутри тела, будет 1,2 * 12 или 14,4 пикселей.

Как я могу конвертировать между PX, EM,% и PT?

Вот формулы, которые используются в конвертере.

Примечание: 16px используется как размер основного текста во всех конверсиях, потому что это браузер по умолчанию. Вы измените 16px на ваш основной размер текста.

PX to EM
Формула: размер в пикселях / Родительский размер в пикселях
Пример: 12px / 16px = .75em

PX to %
Формула: size in pixels / parent size in pixels * 100
Пример: 12px / 16px * 100 = 75%

PX to PT
Формула: size in pixels * (points per inch / pixels per inch)
Пример: 16px * (72pt / 96px) = 12pt

EM to PX
Формула: size in EMs * parent size in pixels
Пример: .75em * 16px = 12px

EM to %
Формула: size in EMs * 100
Пример: .75em * 100 = 75%

Зачем размер текста с помощью EM в CSS?

Таблицы стилей, использующие EM, легче поддерживать для дизайнера и более доступны для конечных пользователей.

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

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

Преобразование px в em

Выберите размер шрифта вашего body в пикселях (px)и получите полную таблицу преобразования пикселей (px) в em, что сделает эластичный веб-дизайн с помощью CSS очень простым. Когда-то пугающая задача преобразования пикселей (px) в неуловимые em теперь перестала быть проблемой.