在 HTML 网站中嵌入 SVG/SVGZ 矢量图形的最简单方法(适用于所有主要 2016 浏览器)
在网站中嵌入矢量 SVG 或压缩 SVGZ 插图的最简单方法是什么?
它必须在 2016 版 Firefox、Chrome、Opera、Safari 和 Internet Explorer 下正常工作。
What is the easiest way to embed vector SVG or compresed SVGZ illustrations in a website?
It must work correctly under 2016 versions of Firefox, Chrome, Opera and Safari and Internet Explorer.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
这会帮助你...
this will help you...
IE8 不以任何方式支持 SVG(无需额外的库,如 SVGWeb),因此无论您的标记如何,您都无法让它工作。
虽然您描述的方法效果很好,但我个人更喜欢将 SVG 内联包含在 XHTML 中,因为它允许我将 HTML 和 SVG 的 CSS 样式混合在一起,并提供完整的 JavaScript 混合。我在这里有一个例子: http://phrogz.net/svg/3-point -circle.xhtml
请务必从您的网络服务器以
Content-Type:application/xhtml+xml
形式提供 .xhtml 文件。IE8 does not support SVG in any way (without additional libraries, like SVGWeb), so you're not going to get it to work whatever your markup.
Although the method you describe works well, I personally prefer to include my SVG inline in XHTML, as it allows me to mix CSS styles for the HTML and SVG together, and provide full JavaScript intermingling. I have an example of this here: http://phrogz.net/svg/3-point-circle.xhtml
Be sure to serve .xhtml files as
Content-Type:application/xhtml+xml
from your web server.您可以将 SVG 转换为 Raphael.is
这将使其能够在 IE6 及更高版本以及 Webkit 浏览器中运行。
只需查看此图像,完成后单击链接即可访问该页面和 SVGTOHTML 工具。
不确定 SVGZ,但这些文件非常紧凑,可以在 Webkit 的 SVG 上运行,并且在专有 IE 中称为 VML。
http://www.irunmywebsite.com/raphael/teacup.php
对于在 iPod 上输入拼写的问题,我们深表歉意!
You can transform SVG into Raphael.is
That will make it work in IE6 and up as well as Webkit browsers.
Just look at this image, when you finished click on the links to get to the page and the SVGTOHTML tool.
Not sure about SVGZ but these files are pretty compact and work on SVG for Webkit and aching called VML in proprietary IE.
http://www.irunmywebsite.com/raphael/teacup.php
Apologies for spelling typing on iPod!
您可以使用 svgweb,这是一个创建跨浏览器兼容的 SVG 嵌入的工具包。对于 IE,它会自动创建 Flash 文件。
http://code.google.com/p/svgweb/
You could use svgweb, a toolkit that creates crossbrowser compatible SVG embeds. For IE it automatically creates a Flash file.
http://code.google.com/p/svgweb/