Less による CSS `calc()` プロパティの誤ったコンパイルを防ぐにはどうすればよいですか?

CSS calc() プロパティのコンパイルが少なくなるのを防ぐ

コンパイラが calc() を使用して定義された CSS プロパティをコンパイルしようとすると、問題が発生することがよくあります。関数。たとえば、入力:

body { width: calc(100% - 250px - 1.5em); }

は予期せず次のように変換される可能性があります:

body { width: calc(-151.5%); }

この不正確な変換により、望ましくない結果が生じる可能性があります。

解決策を少なくする

バージョン 3.00 以降は廃止されましたデフォルトで calc() 内の式を評価します。したがって、提供された入力はコンパイル中に変更されません。

3.00 より前の Less バージョンでは、~ 演算子を使用して計算をエスケープできます:

body { width: calc(~"100% - 250px - 1.5em"); }

厳密な数学オプションLess

Less バージョン 1.4.0 では strictMaths オプションが導入されました。このオプションを有効にすると、すべての Less 計算を括弧で囲む必要があります。この場合、calc() 内の計算は尊重され、コンパイル中に評価されません。このオプションは既存のコードを壊す可能性があるため、注意して使用する必要があることに注意してください。

以上がLess による CSS `calc()` プロパティの誤ったコンパイルを防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。