LESSにおけるcalc関数
CSSの関数calcのラッパーとなる関数を作ってみましょう。
この関数は、最初のパラメータとしてプロパティ名を受け取り、
2番目のパラメータとして計算される値を受け取るようにします:
styles.less.calc(@name, @calc) {
@{name}: calc(@calc);
}
作った関数を使ってみます:
styles.lessp {
.calc(width, ~'10px + 30%');
}
コンパイル結果:
styles.cssp {
width: calc(10px + 30%);
}
Задание 1
次のコードをコンパイルした結果はどうなるか説明してください:
styles.lessp {
.calc(width, ~'10px + 30%');
.calc(height, ~'10px + 30%');
}