Как мне преобразовать PX в REM для моего типа? Я прочитал статью Джонатана Снука об использовании REM, но он использовал размер шрифта: 62,5%, который по умолчанию соответствует вашему размеру шрифта до 10 пикселей (для упрощения расчета). Как бы я преобразовал свои единицы PX в REM, если бы я использовал 100%, 75% и т.д.?
Как рассчитать REM для типа?
Ответ 1
Target Size / Base Size = Value
Поскольку мы можем предположить, что браузеры используют 16px по умолчанию (в конце концов, то, что сделал Джонатан Снук, предположил, что 62,5% - 10 пикселей), тогда ваша база равна 16. Если вы хотите 32px, тогда 32 / 16 = 2
, захотите 40px, тогда 40 / 16 = 2.5
, хотите 24, затем 24 / 16 = 1.5
.
То же самое касается 75%... Определите, что такое 75% (12), и выполните тот же расчет. Если вы хотите 32px, то 32 / 12 = 2.666
, хотите 40px, затем 40 / 12 = 3.333
, хотите 24, затем 24 / 12 = 2
.
Ответ 2
если вы просто добавите этот код в свой файл стиля
html {
font-size: 62.5%;
}
конвертирует 1 rem = 10px. Теперь вы будете работать с базой 10px. Так
body {
font-size: 1.6 rem;
}
у вас будет размер шрифта 1.6 * 10 = 16 пикселей.