Конвертирайте px, rem, em, pt и % с жива таблица и готов за копиране CSS

Стойност за конвертиране
px
px

rem е спрямо основния размер на шрифта; em и % са спрямо родителя.

Конвертирани стойности
px
0
rem
0
em
0
pt
0
%
0
Често срещани стойности
PXREMEMPT
10
12
14
16
18
20
24
28
32
40
48
64
CSS фрагмент

						

За Конвертор от пиксели в EM/REM

Конвертора px към EM/REM превежда стойности за дължина в CSS между px, rem, em, pt и проценти. Въведете стойност в която и да е от петте единици и жива таблица показва еквивалента ѝ във всички останали — плюс готов за копиране CSS откъс, който можете да поставите директно в стилов лист.

Преобразуванията отчитат как CSS реално разрешава единиците: rem е спрямо размера на шрифта на кореновия елемент, докато em и % са спрямо размера на шрифта на родителския елемент. И двата референтни размера са редактируеми, така че можете да моделирате корен от 16 px с компонент от 14 px, или всяка скала на дизайн система, която използвате.

Таблица с чести стойности показва размерите, до които дизайнерите посягат най-често — така въпроси като „колко е 24px в rem“ получават отговор с един поглед. Инструментът е безплатен, обновява се докато пишете и е основен помощник за превръщане на макети с фиксирани пиксели в достъпен, мащабируем CSS, базиран на rem.

Как да използвате Конвертор от пиксели в EM/REM

  1. Въведете стойността за преобразуване и изберете нейната единица: px, rem, em, pt или %.
  2. Коригирайте кореновия размер на шрифта (за rem) и родителския размер на шрифта (за em и %), ако се различават от 16 px.
  3. Прочетете преобразуваните стойности в живата таблица.
  4. Копирайте генерирания CSS откъс или всяка стойност от таблицата с чести стойности.

Често задавани въпроси

rem винаги е спрямо размера на шрифта на кореновия (html) елемент, докато em е спрямо наследения размер на шрифта на текущия елемент. Вложените em стойности се натрупват, затова rem обикновено е по-предвидим за оформление.

При стандартния корен от 16 px, 16 px се равнява точно на 1 rem. Променете полето за кореновия размер и конвертора преизчислява — при корен от 18 px, 16 px стават около 0,889 rem.

Стойностите в rem се мащабират, когато потребителите променят базовия размер на шрифта в браузъра си, запазвайки текста четим за хора, нуждаещи се от по-голям шрифт. Фиксираните px размери игнорират тази настройка, което вреди на достъпността.

CSS дефинира 1 pt като 1/72 от инч и 1 px като 1/96, така че 1 pt = 1,333 px и 12 pt = 16 px. Точките се появяват най-вече в стилови листи за печат и документи, импортирани от текстообработващи програми.

За размер на шрифта % е спрямо размера на шрифта на родителския елемент, точно както em: 100% се равнява на размера на родителя, така че 87,5% от родител с 16 px са 14 px. Задайте полето за родителски размер, за да отговаря на вашия контекст.

Сподели

Популярни търсения
конвертор от px в rem конвертор от px в em пиксели в rem rem в px конвертор на css единици калкулатор px em rem
Нуждаете се от помощ?
Открихте проблем с този инструмент? Кажете ни.
Докладване на проблем

Добавете този безплатен инструмент към собствения си уебсайт — копирайте и поставете кода по-долу.