11

Firefox、Internet Explorer、Opera は次のコードを受け入れます。

<html>
<head>
<style type="text/css">
.minus
{
    width: 11px;
    height: 11px;
    background-image: url("data:image/gif;base64,R0lGODlhCwALAIABAAAAAP///yH5BAEAAAEALAAAAAALAAsAAAIUhI8Wy6zdHlxyqnTBdHqHCoERlhQAOw");
}
</style>
</head>
<body>
<div class="minus">
</body>
</html>

Chrome (バージョン 19.0.1084.56) にはありません。なんで？

4

4 に答える 4

7

これは Chrome のバグです。バグ #105725を参照してください。base64 文字列をパディングする必要があります。次のソリューションは正常に機能します: http://jsfiddle.net/TunfH/ (最後に追加==しました)。

<html>
<head>
<style type="text/css">
.minus
{
    width: 11px;
    height: 11px;
    background-image: url("data:image/gif;base64,R0lGODlhCwALAIABAAAAAP///yH5BAEAAAEALAAAAAALAAsAAAIUhI8Wy6zdHlxyqnTBdHqHCoERlhQAOw==");
}
</style>
</head>
<body>
<div class="minus"></div>
</body>
</html>
于 2012-06-16T22:31:47.530 に答える
4

あなたの base64 データは無効です。

data:image/gif;base64,R0lGODlhCwALAIABAAAAAP///yH5BAEAAAEALAAAAAALAAsAAAIUhI8Wy6zdHlxyqnTBdHqHCoERlhQAOw==

ChromeとFirefoxで問題なく動作するようです[私がアクセスできるもの]

Chrome にはより厳密な base64 実装があり、パディングが必要であると推測しています。

于 2012-06-16T22:31:06.503 に答える