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 回答
3

您的问题是您有“//”，您需要“转义”以避免在控制台中看到 err_invalid_url 警告

所以拿你的：

R0lGODlhCwALAIABAAAAAP///yH5BAEAAAEALAAAAAALAAsAAAIUhI8Wy6zdHlxyqnTBdHqHCoERlhQAOw

并将其转换为

R0lGODlhCwALAIABAAAAAP/%0a/%0a/yH5BAEAAAEALAAAAAALAAsAAAIUhI8Wy6zdHlxyqnTBdHqHCoERlhQAOw

它会正确显示

如果图像以“/”开头，应使用相同的解决方案，将其替换为“%0a/”

于 2017-09-05T08:11:15.357 回答
-1

我将 ...;charset=utf-8;base64, .... 添加到我的一个文件中，这对我有用，只是想我会分享使用 chrome 对我有用的东西，我知道我添加了图像文件到我的代码，但它没有显示在我客户的计算机上，发现这是一个 chrome 问题，添加字符集解决了我的问题。

于 2016-04-30T16:36:46.623 回答