0

contrastこの機能を初めて使用しましたが、バグがあると思います。

このページには、次の説明があります。

contrast(@color1, @darkcolor, @lightcolor);
    // outputs @darkcolor, when @color1 have more than 43% Luma
    // if not it outputs @lightcolor

私はこれらの 2 色:

@gBlue: #2196F3;
@gLightBlue: #03A9F4;

最初の色には 60 の輝度があり、2 番目の色には 65 の輝度があります。@lightcolorLess が両方の色の を与えてくれることを期待しています。しかし、それは私が得ている結果ではありません!

Lessphp は@darkcolorfor@gBlue@lightcolorforを返します@gLightBlue

なぜこれができるのか誰にも教えてもらえますか?これはバグですか?@lightcolorどちらの場合もを取得しないのはなぜですか?

ここに画像の説明を入力

4

1 に答える 1

1

注: v0.5.0 のソース コードは、lessphp が明度 (v0.4.0 で使用) の代わりに輝度値もチェックするようになったことを示しているため、最新バージョンにアップグレードすると問題も解決するはずです。

これはバグではなく、contrastLess.js、Less.PHP、lessphp (v0.4.0まで) での関数の動作の違いのようです。

Less.jsと Less.PHPlumaでは、コントラスト関数が基準色の値に基づいて出力色を決定します。問題の 2 色のluma値は 43% 未満であるため、@lightcolor. 以下のコードの出力は、Less2CSS.org (オンライン Less.js コンパイラ) およびオンライン Less.PHP コンパイラで確認できます。

#sample{
  color:contrast(@color1, @darkcolor, @lightcolor);
  luma-color1: luma(@color1);
  luma-color2: luma(@color2);
}

@color1: #2196F3;
@color2: #03A9F4;
@darkcolor: black;
@lightcolor: white;

ただし、lessphp のドキュメントcontrastでは、関数について次のように説明されています: (ドキュメントはv0.5.0 の変更で更新されていないようです)

contrast(color, dark, light)— 色の明度の値が 50% を超える場合は暗が返され、それ以外の場合は明が返されます。

最初の色のlightness値は 54% で、2 番目の色の値は 48% です。このため、lessphp@darkcolorは、1 番目の色を基準にし た場合と 2 番目の色を基準にした場合を出力@lightcolorします。

以下のコードを v0.4.0 のオンライン lessphp コンパイラで試して、私の意味を確認してください。

#sample{
  color:contrast(@color2, @darkcolor, @lightcolor);
  lightness-color1: lightness(@color1);
  lightness-color2: lightness(@color2);
}

@color1: #2196F3;
@color2: #03A9F4;
@darkcolor: black;
@lightcolor: white;

公式の Less (JS バージョン) コンパイラが同じ関数を実装する前に、 lessphpcontrast最初に値に基づいて関数を導入した可能性がありますが、値の代わりにlightness基づいています。以下のステートメントは、Less のドキュメントに記載されています。lumalightness

この関数は、 Compass for SASSのコントラスト関数と同じように機能します。WCAG 2.0に従って、明度ではなく、ガンマ補正された輝度値を使用して色が比較されます。

于 2015-09-25T15:34:34.807 に答える