Правилно добавяне на единица към номер - CSS-трикове

Anonim

Когато преобразувате безразмерно число в дължина, продължителност, ъгъл или каквото и да било, хората са склонни просто да добавят единицата като низ, като този:

$value: 42; $length: $value + px; // 42px

Въпреки че този метод работи, той далеч не е идеален, защото води до неявно излъчване на първоначалната стойност като низ. Всъщност, ако се опитате да правите математика със $lengthстойността отсега нататък, ще видите, че Sass бързо изхвърля грешка, защото не може да прави математически оператори със низ.

За да заобиколите този проблем, има два начина да направите това правилно:

$value: 42; $length: $value + 0px; // 42px
$value: 42; $length: $value * 1px; // 42px

Всеки от тези методи правилно ще създаде число, както се очаква, а не низ.