SVG 在 HTML 页面

SVG 在 HTML 页面

SVG 文件可通过以下标签嵌入 HTML 文档:、 或者 。

SVG的代码可以直接嵌入到HTML页面中,或您可以直接链接到SVG文件。


使用 标签

:

优势:所有主要浏览器都支持,并允许使用脚本
缺点:不推荐在HTML4和XHTML中使用(但在HTML5允许)

语法:

结果:


使用 标签

:

优势:所有主要浏览器都支持,并支持HTML4,XHTML和HTML5标准
缺点:不允许使用脚本。

语法:

结果:


使用 标签

:

优势:所有主要浏览器都支持,并允许使用脚本
缺点:不推荐在HTML4和XHTML中使用(但在HTML5允许)

语法:

结果:


直接在HTML嵌入SVG代码

在Firefox、Internet Explorer9、谷歌Chrome和Safari中,你可以直接在HTML嵌入SVG代码。

实例


链接到SVG文件

您还可以用标签链接到一个SVG文件:链接到SVG文件

您还可以用标签链接到一个SVG文件:

View SVG file

结果:

查看 SVG 文件

相关推荐

2020-01-19

在这里插入图片描述

HTML入门(0基础)-你要的这里全都有-带你进入HTML的世界:)

HTML小结

HTML与XML之间的秘密