2noの日記

メモ用

【CSS3】各ブラウザにおける rgba の誤差

各ブラウザで rgba の挙動が違う。
誤差が生じるのはアルファ値だが、以下のとおり結果が異なる。

テスト例:

var div = document.createElement("div");  
div.style.backgroundColor = "rgba(0, 0, 0, 0.5)";

各ブラウザで backgroundColor の値を確認したところ

  • Google Chrome 22.0.1229.94
    結果:"rgba(0, 0, 0, 0.498039)"
  • Safari 6.0.1 (8536.26.14)
    結果:"rgba(0, 0, 0, 0.496094)"
  • Firefox 16.0.1
    結果:"rgba(0, 0, 0, 0.5)"
  • Opera 12.01
    結果:"rgba(0, 0, 0, 0.5059)"

Firefox の結果が理想的。
各ブラウザで値の持ち回りが違うのだろうが、どう言った計算でこうなったのかは気になるところ