less演算(operations)

一:概念
演算タイプ:任意の数値、色、変数は単位を演算できます:lessは単位を自動的に推定するので、単位を追加する必要はありませんが、少なくとも1つの追加単位を保証します.注意:演算子と数値の間にスペースを分け、優先度に関連する場合は()で優先度を計算します.
二:実例分析
1.数値型演算

小例lessファイル

header{
    width: 100px + 10;
    height: 20 + 10px;
}

コンパイル後のcssファイル

header {
  width: 110px;
  height: 30px;
}

は、優先度の小さな例に関し、lessファイル

を高優先度で囲む()

    height: (10 + 30) * 2px;

コンパイル後のcssファイル

  height: 80px;

注意:単位はどこでもいいです.単位がある場所があれば、lessは計算後の結果の単位を推定することができます.
2.色値演算

ルール:lessは、演算時に色値をrgbaモードに変換してから16進数の色値に変換し、

を返します.

注意1:色演算では、red-55=#c 80000などの色の名前をgreenのように直接使用して演算できますが、これまではこの機能は無効でした

.

注意2:実際には分割後に16進数のffffff-55=c 8 c 8 c 8=rgb(200200200)に変換し、r,g,b

を表す2つの1つに分解する.

注意3:加算値は255を超え、255#111111+260=#ffff

にのみ取得されます.

注意4:rgbモードの値は0~255

である.

小例lessファイル

background-color: red - 55;
background-color: #111111 + 260;
background-color: #000000 + 55;

コンパイル後のcssファイル

  background-color: #c80000;
  background-color: #ffffff;
  background-color: #373737;

3.進数間の変換は、記事「最も一般的な進数間の変換」を参照してください.http://www.jianshu.com/p/32a9fad022ec