1.使用HTML标签

 以下三个标签所有主流浏览器都支持

  a.<iframe>标签

  优势:允许使用脚本

  缺点:虽然不是HTML5的新增标签,但是不推荐在HTML4 和 XHTML中使用

  例:<iframe src="circle.svg"></iframe>

  b.<embed>标签 (HTML5新增标签)

  例:<embed src="circlr.svg" type="image/svg+xml"/>

  优势:允许使用脚本

  缺点:只能在HTML5中使用

  c.<object>标签

  例:<object data="circle.svg" type="image/svg+xml"></object>

  优势:可以在HTML4、HTML5 和 XHTML中使用

  缺点:不能使用脚本

  如果安装了最新版本的Adobe SVG viewer,那么使用object引用svg文件将不会起到作用,至少IE不会

2.直接嵌入HTML文档

  注意点:IE9+、FF、Chrome、Safari可以直接在HTML中嵌入svg代码,Opera不可以

  例:

  <html>
  <body>

  <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>

  </body>
  </html>

 3.使用a标签链接到SVG

  例:

  <a href="circle1.svg">View SVG file</a>

 

采访JON FERRAIOLO:SVG的过去,现在和未来( 2012年10月15日 )

SVG如何嵌套在HTML中的更多相关文章

  1. 关于ViewPager被嵌套在ScrollView中不显示的问题

    关于ViewPager被嵌套在ScrollView中不显示的问题 进入全屏 ScrollView 嵌套ViewPager,要不是业务需求这样,估计没人愿意这么干!因为这种方式,会问题多多,简单百度一下 ...

  2. WPF触屏Touch事件在嵌套控件中的响应问题

    前几天遇到个touch事件的坑,记录下来以增强理解. 具体是 想把一个listview嵌套到另一个listview,这时候如果list view(子listview)的内容过多超过容器高度,它是不会出 ...

  3. svg矢量图标在html中的使用, (知识点:1.通过h5中的css实现点击变色,2.一个svg文件包含多个图标)

    svg矢量文件体积小,不变形,比传统的png先进,比现在流行的icon-font灵活.然而在使用过程中还是遇到了很多坑.今天花了一天时间把经验整理出来,以供后来者借鉴.如果您从本文收益,请留言mark ...

  4. 母版页改变被嵌套的页面中的控件ID的解决方法

    使用过模板页的朋友都会很纳闷,怎么页面的用js通过getElementById(“id”):找不到对象.查看了页面源代码才发现,原来控件的ID变了,这是母版页导致的.因为母版页怕母版页本身页面中的控件 ...

  5. 嵌套在ScrollView中的TextView控件可以自由滚动

    //设置TextView控件可以自由滚动,由于这个TextView嵌套在ScrollView中,所以在OnTouch事件中通知父控件ScrollView不要干扰. mContractDesc.setO ...

  6. matlab学习笔记12_2创建结构体数组,访问标量结构体,访问非标量结构体数组的属性,访问嵌套结构体中的数据,访问非标量结构体数组中多个元素的字段

    一起来学matlab-matlab学习笔记12 12_2 结构体 创建结构体数组,访问标量结构体,访问非标量结构体数组的属性,访问嵌套结构体中的数据,访问非标量结构体数组中多个元素的字段 觉得有用的话 ...

  7. 1. svg学习笔记-在网页中使用svg

    在网页中使用svg有以下三种方式 1. svg归根结底来说是一种图像格式,虽然有别于jpeg,gif,png等位图图像格式,所以在网页中能嵌入图像的地方都可以嵌入svg,例如将svg文件设置为< ...

  8. Android 6.0+ RecyclerView嵌套在ScrollView中显示不全

    ScrollView嵌套RecyclerView在Android6.0以下能正常显示,但是在6.0以上就会出现RecyclerView显示不全的bug.尝试多种方法之后终于找到解决办法,特在此记录下. ...

  9. 解决嵌套在ScrollView中的TableView滑动手势冲突问题

    最近在迭代开发公司项目的时候遇到了一个问题,在可以左右切换标签视图的ScrollView中嵌套了两个TableView用于展示视图,感觉一切so easy的情况下,问题出现了,因为左右两个视图既可以实 ...

随机推荐

  1. Android中怎样自己制作su

    本文原博客:http://hubingforever.blog.163.com/blog/static/171040579201372915716149/ 在Android源代码的system\ext ...

  2. CF 568A(Primes or Palindromes?-暴力推断)

    A. Primes or Palindromes? time limit per test 3 seconds memory limit per test 256 megabytes input st ...

  3. 使用session来存储用户的登录信息

    对存在cookie端数据进行加密处理,具体代码如下: <?php session_start(); //假设用户登录成功获得了以下用户数据 $userinfo = array( 'uid' =& ...

  4. 线程池ThreadPoolExecutor分析

    线程池.线程池是什么,说究竟,线程池是处理多线程的一种形式,管理线程的创建,任务的运行,避免了无限创建新的线程带来的资源消耗,可以提高应用的性能.非常多相关操作都是离不开的线程池的,比方android ...

  5. js对象的属性问题

    ES6之前js的对象的属性只能是字符串, <html> <head> <script type="text/javascript"> var a ...

  6. adb pull 与 push

    adb pull <remote> <local> Copies a specified file from an emulator/device instance to yo ...

  7. Marlin固件之—:基础入门与測试

    一.Marlin的简介 Marlin固件是一个3D打印的开源固件,3D打印固件有很多,Marlin最为健全和强大,当然相对也会复杂一些.使用Gcode控制爱.Gcode是数控机床等工控控制使用范围较广 ...

  8. android 编程小技巧(持续中)

    first:     Intent跳转一般存用于Activity类,可是若要在非activity类里跳转的话,解决方法是在startActivity(intent)前加mContext即上下文,终于为 ...

  9. 2016/07/05 zend optimizer

    Zend Optimizer是由PHP核心引擎“Zend” http://www.zend.com 创建者Zend技术公司所开的免费PHP优化软件.据Zend公司透露使用这个软件某些情况下至少可以提高 ...

  10. Eclipse中设置编码的方法

    Eclipse中设置编码的方式如果要使插件开发应用能有更好的国际化支持,能够最大程度的支持中文输出,则最好使 Java文件使用UTF-8编码.然而,Eclipse工作空间(workspace)的缺省字 ...