SVG 在HTML页面
SVG 文件可通过 <embed>、<object> 、<iframe> 标签嵌入 HTML 文件中
SVG 的代码可以直接嵌入到 HTML 页面中，也可以直接链接到 SVG 文件
使用 <embed> 标签
<embed src="SVG 文件地址" type="image/svg+xml" />
- 优势： 所有主要浏览器都支持，并允许使用脚本
- 缺点： 不推荐在
HTML4和XHTML中使用（但在HTML5允许）
范例
<embed src="/r/show/yufei/svg/circle_1" type="image/svg+xml" />
结果：
使用 <object> 标签
<object>
- 优势：所有主要浏览器都支持，并支持
HTML4，XHTML和HTML5标准 - 缺点：不允许使用脚本
语法
<object data="SVG 文件地址" type="image/svg+xml"></object>
范例
<object data="/r/show/yufei/svg/circle_1" type="image/svg+xml"></object>
结果
使用 <iframe> 标签
<iframe>
- 优势：所有主要浏览器都支持，并允许使用脚本
- 缺点：不推荐在
HTML4和XHTML中使用（但在HTML5允许）
语法
<iframe src="SVG 文件地址"></iframe>
范例
<iframe src="/r/show/yufei/svg/circle_1" type="image/svg+xml"></iframe>
结果
直接在 HTML 嵌入 SVG 代码
在 Firefox、Internet Explorer9、谷歌Chrome和Safari中，我们可以直接在 HTML 嵌入 SVG 代码
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" /> </svg>
结果
链接到 SVG 文件
可以用 <a> 标签链接到一个 SVG 文件链接到 HTML 中
语法
<a href="SVG 文件地址">查看 SVG 文件</a>
范例
<a href="/t/yufei/svg/circle_1">查看 SVG 文件</a>
结果