0

省略形のフォント値 (関連する質問)を設定しようとしていますが、line-height に使用している変数の動作がおかしいです。あたかも変数が毎回再解釈されるかのように。これはLESSバージョン1.4.2にあります

.info {
    @infoHeight: 22px;
    @infoTopPadding: 2px;
    @infoLineHeight: @infoHeight - @infoTopPadding;
    margin: @infoLineHeight;
    font: bold 13px~'/'@infoLineHeight Arial, sans-serif;
}

結果:

.info {
    margin: 20px;
    font: bold 13px / 22px - 2px Arial, sans-serif;
}

したがって、コンテキストに応じて、同じ変数が 2 つの異なる値になります。これは意図した動作ですか、それともバグでしょうか?

4

1 に答える 1

1

Less >= 1.4.0では、デフォルトで括弧内の数学演算を使用する必要があります(これは仕様ですが、Less 設定で変更できます)。あなたのコードは、Less の古いバージョンでも問題なく動作します。

したがって、Lessで書くと:

.info {
    @infoHeight: 22px;
    @infoTopPadding: 2px;
    @infoLineHeight: (@infoHeight - @infoTopPadding);
    margin: @infoLineHeight;
    font: bold 13px~'/'@infoLineHeight Arial, sans-serif;
}

CSS出力は次のようになります。

.info {
  margin: 20px;
  font: bold 13px / 20px Arial, sans-serif;
}

これがあなたの望ましい/期待される結果であることを願っています。

于 2013-07-23T09:46:15.500 に答える