svg嵌入html有以下3种方式:

OBJECT

< object data = " rect.svg "  width = " 300 "  height = " 100 "  
type = " image/svg+xml " 
codebase = " http://www.adobe.com/svg/viewer/install/ "   />

采用Object标签的一个好处是,这是一个标准的Html 4及以上规范的有效Tag,但可惜的如果你用的是最新的Adobe Viewer,那么反而是显示不出图象来:)

EMBED

< embed  src ="rect.svg"  width ="300"  height ="100"  
type ="image/svg+xml" 
pluginspage ="http://www.adobe.com/svg/viewer/install/"   />

这是推荐的一种写法,在ie与ff中,皆可工作,也可通过script使HTML与SVG相互通信,但不幸的是,embed不是一个规范的标签,所以不能直接用在严格的XHTML中,不过这个可以能过一个简单的trick来解决,改动一下DTD定义即可。

IFRAME

 < iframe  src ="rect.svg"  width ="300"  height ="100" > 
 </ iframe >

这个方式没什么好说的,完全OK,就是iframe的边框需要额外设置一下。

svg学习(二)的更多相关文章

  1. SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  2. SVG 学习<八> SVG的路径——path(2)贝塞尔曲线命令、光滑贝塞尔曲线命令

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  3. SVG 学习<七> SVG的路径——path(1)直线命令、弧线命令

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  4. SVG 学习<六> SVG的transform

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  5. SVG 学习<五> SVG动画

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  6. SVG 学习<四> 基础API

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  7. SVG 学习<三>渐变

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  8. SVG 学习<一>基础图形及线段

    目录 SVG 学习<一>基础图形及线段 SVG 学习<二>进阶 SVG世界,视野,视窗 stroke属性 svg分组 SVG 学习<三>渐变 SVG 学习<四 ...

  9. [翻译svg教程]svg学习系列 开篇

    目录 [翻译svg教程]svg学习系列 开篇 [翻译svg教程 ]svg 的坐标系统 [翻译svg教程]svg 中的g元素 [翻译svg教程]svg中矩形元素 rect [翻译svg教程]svg中的c ...

  10. HTML5实战——svg学习

    百度百科: SVG可缩放矢量图形(Scalable Vector Graphics)是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式.SVG是W3C制定的一种新的二维矢量图形格式,也 ...

随机推荐

  1. 【wikioi】1017 乘积最大

    题目链接 算法:划分型DP 非常典型的一道题目,划分型DP 题目描述: 设有一个长度为N的数字串,要求选手使用K个乘号将它分成K+1个部分,找出一种分法,使得这K+1个部分的乘积能够为最大.同时,为了 ...

  2. HDU 4753 Fishhead’s Little Game(DFS)

    题目链接 很繁琐的爆搜,最多要加2^12条边,暴力就可以,回溯那部分一直没有回溯好,写了一晚上...代码非常,非常难看..对了,还不是普通的爆搜,双向搜索博弈,以前记得看过,这次好像第一次写.. #i ...

  3. Bootstrap_Datatable Ajax请求两次问题的解决

    最近一个项目中使用JQuery Datatable,用起来比较方便,但在测试过程中,发现当条件改变时,有时查询结果中的数据不正确. 使用FireBug跟踪时,发现在使用Ajax请求时,点击一次搜索按钮 ...

  4. html CSS 学习总结

    HTML文件格式 <!DOCTYPE HTML> <html lang="en"> <head> <meta charset=" ...

  5. web页面实现指定区域打印功能

    web页面实现指定区域打印功能 使用CSS,定义一个.noprint的class,将不打印的内容放入这个class内. 详细如下: <style media=print type="t ...

  6. Qt Load and Save Image Dialog 加载图片对话框

    在Qt中,我们想要通过对话框来打开某一个图片,可以通过使用QFileDialog来快速实现,参见以下代码: QString fileName = QFileDialog::getOpenFileNam ...

  7. Js闭包常见三种用法

        Js闭包特性源于内部函数可以将外部函数的活动对象保存在自己的作用域链上,所以使内部函数的可以将外部函数的活动对象占为己有,可以在外部函数销毁时依然存有外部函数内的活动对象内容,这样做的好处是可 ...

  8. JSP页面以及简单的指令

    —JSP(Java Server Pages)是指: —在HTML中嵌入Java脚本语言 —由应用服务器中的JSP引擎来编译和执行嵌入的Java脚本语言命令 —然后将生成的整个页面信息返回给客户端 页 ...

  9. Javascript学习总结

    ---恢复内容开始--- 浏览器对象树

  10. NYOJ背包问题

    #include <stdio.h> struct group{ int value; int weight; }; void Sort(group bag[],int num) { in ...