Come affermato da Quentin, si tratta di un problema in virgola mobile IEEE.
0.1 in realtà non esiste in virgola mobile decimale tecnicamente semplicemente a causa del modo in cui funziona il binario.
0.1 è un decimo o 1/10. Per mostrare in binario, dividere binario 1 da binario 1010, utilizzando divisione lungo binaria:
Come si può vedere, 0.1 in binario è 0.0001100110011....0011 e si continua a ripetere 0011 sull'estremità all'infinito.
I browser selezionano e scelgono il punto disponibile più vicino a 0.1 e lo utilizzano invece come opacità. Alcuni andranno oltre e altri andranno sotto.
FireFox direi che mostra solo la versione leggibile dall'uomo ma, in realtà, utilizza davvero un punto di virgola mobile utilizzabile.
Ad esempio:
body {
color: rgba(0,0,0,0.1); // actually 0.0980392
opacity: 0.1; // actually 0.100000001490116
}
due valori completamente diversi per esattamente lo stesso in virgola mobile.
Questo problema in virgola mobile può essere effettivamente replicato altrove all'interno di browser utilizzando altri linguaggi come Javascript. I numeri Javascript sono sempre a virgola mobile a 64 bit (che credo sia anche il CSS). Questo è più comunemente noto come virgola mobile a doppia precisione. PHP usa anche punti mobili a precisione doppia.
I numeri in virgola mobile a 64 bit sono come si può intuire, memorizzati in 64 bit, dove il numero (la frazione) è memorizzato nei bit da 0 a 51, l'esponente nei bit 52-62 e il bit di segno 63.
Questo causa problemi lungo la linea poiché significa che gli interi vengono contati solo fino a 15 punti decimali e in realtà possono calcolare solo fino a 17 punti decimali.
Ciò significa che i numeri possono essere arrotondati molto facilmente o semplicemente non possono essere memorizzati correttamente.
var x = 999999999999999; // x = 999999999999999
var y = 9999999999999999; // y = 10000000000000000
L'aritmetica per i punti in virgola mobile può anche essere fuori allineamento parecchio anche in luoghi.Come ho mostrato sopra; 0.1 in decimale non è effettivo 0.1 ma 0.000110011... e così via. Ciò significa che alcuni calcoli di base possono essere completamente sbagliati.
var x = 0.2 + 0.1; // x = 0.30000000000000004
Si finisce per dover confondere il sistema per ottenere il numero che si desidera effettivamente. Questo può essere fatto da * il numero da 10 e poi dividendolo per ottenere il risultato desiderato.
var x = (0.2 * 10 + 0.1 * 10)/10; // x = 0.3
di precisione all'interno di computer virgola mobile è molto difficile ed è ancora più difficile quando ci sono più implementazioni differenti (o browser), cercando di fare del loro meglio per la velocità e la visualizzazione delle informazioni sono dato correttamente.
Ci sono diverse informazioni riguardanti i punti in virgola mobile e ciò che il processore CSS (o JS come prevedo possano essere i calcoli uguali) potrebbe cercare di ottenere.
Probabilmente solo l'IEEE floating point problema. Non preoccuparti per questo – Quentin
Ma se si controlla il valore hex/rgb dell'output, lo stesso #efefef come hex e rgb come 239 .. L'output è uguale ad altri browser .. Quindi non preoccupatevi di questo :) –