[解決済み] Base64画像の埋め込み

質問

純粋な好奇心ですが、Base64画像埋め込みはどのブラウザで動作するのでしょうか？私が言及しているのは これ .

ページサイズがかなり大きくなってしまうので、通常はほとんどのものに対して良い解決策ではないとは思いますが、ちょっと気になったので。

いくつか例を挙げます。

HTMLです。

<img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." />

CSSです。

div.image {
  width:100px;
  height:100px;
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...);
}

解決方法は？

更新日：2017-01-10

データURIは主要なブラウザでサポートされるようになりました。IEもバージョン8から画像の埋め込みに対応しました。

http://caniuse.com/#feat=datauri

データURIは、以下のウェブブラウザでサポートされるようになりました。

• Firefox、SeaMonkey、XeroBank、Camino、Fennec、K-Meleon などの Gecko ベース。
• Konqueror、KDEのKIOスレーブ入出力システム経由
• Opera (ニンテンドーDSiやWiiなどのデバイスを含む)
• Safari（iOSを含む）、Androidのブラウザ、Epiphany、MidoriなどのWebKitベース（WebKitはKonquerorのKHTMLエンジンの派生版だが、Mac OS XはKIOアーキテクチャを共有していないので実装が異なる）、およびChromeなどのWebkit/Chromiumベースのもの
• トライデント
  • Internet Explorer 8: マイクロソフトは、データ URI に埋め込まれた JavaScript がウェブベースの電子メールクライアントで使用されるようなスクリプトフィルタによって解釈できないかもしれないという懸念を含むセキュリティ上の理由から、特定の "non-navigable" コンテンツへのサポートを制限しています。データURIは、Version 8[3]では32KiBより小さくなければなりません。
  • データURIは、以下の要素および/または属性にのみサポートされています[4]。
    • オブジェクト(画像のみ)
    • イムグ
    • 入力タイプ=画像
    • リンク
  • background-image、background、list-style-type、list-style など、URLを受け付ける CSS 宣言です。
  • Internet Explorer 9: Internet Explorer 9 は 32KiB の制限を持たず、より広い要素で許可されます。
  • TheWorld Browser。データURIスキームをビルトインでサポートするIEシェルブラウザ。

http://en.wikipedia.org/wiki/Data_URI_scheme#Web_browser_support