我一定要做错事该图像是从插图作为SVG导出的(我不知道这是否相关),它中有一些像素数据.
Here’s my JSFiddle example.
Here’s my JSFiddle example.
请注意,直接进入图像,它显示的很好：
http://ykcreations.com/tv.svg
编辑：这在Chrome或Safari中不起作用,但在Firefox中不起作用. Webkit问题？
解决方法
你的源SVG有一个问题.看到这个更新的小提琴指向
a different SVG file可以正常工作：
http://jsfiddle.net/wdW2K/2/
.tv {
background: url("http://phrogz.net/svg/800x800.svg");
width: 400px; height: 400px;
}
编辑：具体来说,问题似乎是WebKit不支持< image>在用作背景的SVG中.修改您的文件最低限度,以更改< image>参考一个本地(非数据 – uri)文件,并添加< circle />,我可以直接在Chrome中查看SVG时看到图像和圆圈,但是当仅用作背景图像时圈子是可见的.
This bug闻起来相关.
