[html] html中如何使用svg?

1-使用embed标签 推荐

优点

    主流浏览器都支持
    允许使用脚本

缺点

    不推荐在HTML4和XHTML中使用

语法

    <embed src="svg File Path" type="image/svg+xml" width="width" height="height"  pluginspage="要加载的插件地址">

2-使用object标签

优点

    主流浏览器都支持
    HTML4标准标签 兼容性较好

缺点

    不允许使用脚本

语法

<object data="svg File Path" width="width" height="height"></object>

3-使用iframe标签

优点

    主流浏览器都支持
    允许使用脚本

缺点

    不推荐在HTML4和XHTML中使用
    会出现滚动条

语法

 <iframe src="svg File Path" width="width" height="height" pluginspage="plugin path"></iframe>

4-直接嵌入 常用 推荐

语法

直接复制svg文件中的文本

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" ...></svg>

5-a链接跳转 作为href属性

语法

<a href='svg file path'>VIEW SVG</a>

个人简介

我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易,
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题