我有谷歌浏览器没有渲染svg与img标签的问题.刷新页面和初始页面加载时会发生这种情况.我可以通过"Inspecting Element"显示图像,然后右键单击svg文件并在新选项卡中打开svg文件.然后svg图像将在原始页面上呈现.
<img src="../images/Aged-Brass.svg">
Run Code Online (Sandbox Code Playgroud)
在这里完全没有问题是什么.svg图像在IE9和FF中渲染得很好,而不是在Chrome或Safari中.
我也设置了我的MIME类型.(图像/ SVG + XML)
编辑: 这是一个简单的html页面,我建立,以帮助说明我的问题.
<!DOCTYPE html>
<html>
<head>
<title>SVG Test</title>
<style>
#BackgroundImage{
background: url('../images/Aged-Brass.svg') no-repeat scroll left top;
width: 400px;
height: 600px;
}
#ImageTag{
width: 400px;
height: 600px;
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="ImageTag">
<img src="../images/Aged-Brass.svg">
</div>
<div id="BackgroundImage"></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
正如您所看到的,我正在尝试在img标记和css中使用svg文件作为背景图像.在chrome或safari中的初始页面加载都不起作用.当我检查元素右键单击svg或单击链接到另一个窗口中的svg加载时,svg文件将在原始选项卡中呈现.