Как использовать «обратный процент»/безразмерный расчет в CSS-calc()?
Я хотел бы использовать следующий расчет в width и height элемента:
(1 / 0.65) * 100, then the % sign
Итак, ширина и высота установлены на 153,85%.
Однако я считаю, что первое число должно содержать единицы или проценты, чтобы calc работал.
Как я могу установить это в calc, а не жестко запрограммировать его в 153.85%?
153,85% — это обратный процент 65% — согласно этому вопросу Math.SE.
Я попробовал calc(100% / 65%), но это было отмечено как неверный синтаксис.
@l'L'l Отлично, это работает, спасибо! Хотите опубликовать ответ, и я приму? Еще раз спасибо! ....вообще-то я только что понял, что calc(100% / 0.65) тоже работает 🙈
Ответы 2
Вы можете попробовать использовать 100vh/vw вместо 100%:
height: calc(100vh / 0.65);
width: calc(100vw / 0.65);
Возможно transform: scale(calc(1/0.65),calc(1/0.65)) Я обновил свой комментарий.
На самом деле это работает, прошу прощения, спасибо! (часть 100vw, а не часть transform)
Вы можете преобразовать процент в «необработанную» форму, а затем выполнить расчет:
calc((100% * 100) / 65);
(100% * 100) / 65 ведет себя последовательно и правильно в CSS, потому что правильно манипулирует единицами измерения в соответствии с правилами CSS. (100% / 0.65) использует прямое деление процента на безразмерное число и может не всегда поддерживаться разными браузерами. Кроме того, использование метода, показанного выше, сохраняет процент на протяжении всего расчета, тогда как последний — нет.
Может быть, попробуйте так:
calc((100% * 100) / 65);