.svg图像文件不能用作背景图像，具体取决于文件的存储位置

Question

当我拍摄svg图像并登录亚马逊cdn或在visual studio的本地网络服务器中时，它无法作为背景图像工作。我假设它在http标题中。

http://jsfiddle.net/LB84y/

div{
height:200px;
width:200px;
border: 1px solid black;
background-size:100%; 
 }

   .div1{
    background-image:   url(http://dev.bowdenweb.com/a/fonts/symbols/pictonic/svgs/google.svg);
   }

.div2{
    background-image:        url(http://resources.emazetest.com.s3.amazonaws.com/vbwebeditor/images/menu/general/google.svg);
  }

Answer 1

似乎第二台服务器（我相信的亚马逊服务器）只是让下载文件而不是按原样显示。

这意味着这不是您的脚本中的问题，它在服务器中存在问题，它们可能具有非用于网络资源的策略或其他内容，并且它们仅允许您上载要下载的内容。这可能是一件安全事情。

Answer 2

http://dev.bowdenweb.com/a/fonts/symbols/pictonic/svgs/ 第一个svg图像文件存储在普通文件夹结构中。

http://resources.emazetest.com.s3.amazonaws.com/ 第二个资源是XML格式的。所以这可能是个问题。

Answer 3

问题是内容类型。 通过将其设置为image / svg + xml，它现在可以正常工作。