使用Firefox 3.5在HTML中内联SVG

Question

我正在尝试创建一些混合的HTML/SVG内容并遇到一些麻烦.HTML内容按预期显示,但内联SVG没有.所以,我做了一些实验.

我发现有内联SVG示例的网站,它们在我的系统上正确呈现.因此,我"查看页面源"并将HTML/SVG复制/粘贴到另一个本地文件中,然后在Firefox中打开此文件.没有内联SVG可见.

我也尝试过与Chrome相同的实验,结果相同.

我可能会失踪什么？

更新
我的身份略有变化:k montgomery - > kmontgom使用OpenID.

无论如何,感谢所有回答的人.最好的解决方案是设置Response.ContentType; 这让我现在继续使用WebForms方法.

我曾考虑在.xml文件中制作纯XHTML内容,并使用ASP.NET MVC来提供该内容.我将来最终可能会这样做.

现在,继续使用jQuery,SVG,让事情做点什么.

谢谢你的帮助.

Answer 1

An alternative if you don't want to do XHTML is to base64 encode the SVG data.

e.g.

<object type="image/svg+xml" 
        data="data:image/svg+xml;base64,PCFET0NUWVBFI...etc..."></object>

I think this is probably not what you want specifically for your situation, but anyway, may be useful for others.

Answer 2

为了在浏览器中显示内联SVG,页面必须是XHTML有效的,并且必须与application/xhtml + xml mime类型的服务器响应头一起提供.

也可以从HTML页面中提取内联SVG内容,查看SVG Tiger图像的示例,该图像也可以在Internet Explorer中查看(5.5+)

Answer 3

确保将文件命名为".xml"而不是".html"