SVG是一种矢量图,放大缩小皆不会失真。这种矢量图,可以用作标签或者用作一些具有交互效果的图片。我们使用SVG作为网页的一部分的时候,有如下几种方法:
一,使用embed标签
二,使用object标签
三,使用iframe
<iframe src="SVG路径">iframe>
四,直接用img引入svg
<img src="SVG路径"/>
五,把svg当作背景,即:用background引入svg
background-image: url("SVG路径");
六,直接嵌入网页
<body>
<div>
<svg>....svg>
div>
body>
七,使用JQuery的load()或ajax加载进来
比如我们要将svg文件装载到 <div id="div">div> 1,jQuery的load: 用jQuery的load的话就要在js里写 $("#div").load("xxx.svg"); 2,ajax加载就要在js里这样写: $.ajax({ url:"xxx.svg", type:"get", dataType:"html", success:function(data){ $("#div").html(data); } }); 八,在第四种方法的基础上,为了兼容低版本的浏览器,加入一个svg.js 1,首先用script标签引入svg.js: <script type="text/javascript" src="svg.js">script> 2,其次直接在div中嵌入svg标签: <body> <div> <svg>....svg> div> body> 这样能有效兼容低版本IE,从IE9开始。 以上是我的查找总结,如果有什么不对的地方,请大家评论,我会及时查看修改。 转载于:https://www.cnblogs.com/yu-tang/p/11459056.html