2

lesscss ファイルでパーセンテージを 2 桁の精度で取得しようとしています。lesscss ファイル内

@w: round(((100-((12-5)*3.8))/(12/5))*100);
width: percentage(@w/10000);

幅にコンパイル: 30.580000000000002%; 私は何を間違っていますか?

私のロジックは非常に単純です:
ステップ1:「正しい」数字30.58000000000000002を取得します。
ステップ2:30.580000000000002*100 = 3058.0000000000002
ステップ3:ラウンド(3058.00000000002)= 3058
ステップ4:3058/10000 = 0.3058
ステップ5:パーセント(0.3058)= 0.3058 30.58

4

3 に答える 3

2

浮動小数点計算が 1/10000 の正確な表現がないバイナリで行われるとは考えていません。したがって:

/* 30.580000000000002 */
console.log(Math.round(((100 - ((12 - 5) * 3.8))/(12 / 5)) * 100) / 10000 * 100);

(計算がIEEE-754倍精度浮動小数点数に基づいている限り、LESS が JavaScript のような ECMAScript 実装を使用するかどうかは問題ではありません。)

ただし、それについて気にする必要はありません。

width: 30.580000000000002%;

完全に有効な CSSです。

于 2012-07-09T18:44:34.287 に答える
1

次のようround()に、メソッドをメソッドでラップする必要があります。percentage()

@w: round(((100-((12-5)*3.8))/(12/5))*100);
width: round(percentage(@w/10000));
于 2012-07-09T18:40:55.050 に答える
1

あなたの質問は、データ トラフィックを最小限に抑えようとするときに重要になる可能性があります。最近では、仮数に 1 つまたは 2 つ以上の数字を含む CSS パーセンテージをネットワーク経由で送信することは意味がありません

次の LESS 入力があるとします。

w: 100 %;
w: round(512 * 1%, 2);
w: 2.0 / 3.0 * 100 * 1%;
w: round(2.0 / 3.0 * 100 * 1%, 2);
w: round(0.19%, 2);
w: round(0.19%, 1);
w: round(10000%, 1);
w: round(10000, 1);

および対応する出力:

w: 100 %;
w: 512%;
w: 66.66666666666666%;
w: 66.67%;
w: 0.19%;
w: 0.2%;
w: 10000%;
w: 10000;

私たちround(percentage, 2)が望むものを非破壊的に達成することがわかります。

于 2013-02-26T15:49:28.370 に答える