SVG如何嵌套在HTML中
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中的更多相关文章
- 关于ViewPager被嵌套在ScrollView中不显示的问题
关于ViewPager被嵌套在ScrollView中不显示的问题 进入全屏 ScrollView 嵌套ViewPager,要不是业务需求这样,估计没人愿意这么干!因为这种方式,会问题多多,简单百度一下 ...
- WPF触屏Touch事件在嵌套控件中的响应问题
前几天遇到个touch事件的坑,记录下来以增强理解. 具体是 想把一个listview嵌套到另一个listview,这时候如果list view(子listview)的内容过多超过容器高度,它是不会出 ...
- svg矢量图标在html中的使用, (知识点:1.通过h5中的css实现点击变色,2.一个svg文件包含多个图标)
svg矢量文件体积小,不变形,比传统的png先进,比现在流行的icon-font灵活.然而在使用过程中还是遇到了很多坑.今天花了一天时间把经验整理出来,以供后来者借鉴.如果您从本文收益,请留言mark ...
- 母版页改变被嵌套的页面中的控件ID的解决方法
使用过模板页的朋友都会很纳闷,怎么页面的用js通过getElementById(“id”):找不到对象.查看了页面源代码才发现,原来控件的ID变了,这是母版页导致的.因为母版页怕母版页本身页面中的控件 ...
- 嵌套在ScrollView中的TextView控件可以自由滚动
//设置TextView控件可以自由滚动,由于这个TextView嵌套在ScrollView中,所以在OnTouch事件中通知父控件ScrollView不要干扰. mContractDesc.setO ...
- matlab学习笔记12_2创建结构体数组,访问标量结构体,访问非标量结构体数组的属性,访问嵌套结构体中的数据,访问非标量结构体数组中多个元素的字段
一起来学matlab-matlab学习笔记12 12_2 结构体 创建结构体数组,访问标量结构体,访问非标量结构体数组的属性,访问嵌套结构体中的数据,访问非标量结构体数组中多个元素的字段 觉得有用的话 ...
- 1. svg学习笔记-在网页中使用svg
在网页中使用svg有以下三种方式 1. svg归根结底来说是一种图像格式,虽然有别于jpeg,gif,png等位图图像格式,所以在网页中能嵌入图像的地方都可以嵌入svg,例如将svg文件设置为< ...
- Android 6.0+ RecyclerView嵌套在ScrollView中显示不全
ScrollView嵌套RecyclerView在Android6.0以下能正常显示,但是在6.0以上就会出现RecyclerView显示不全的bug.尝试多种方法之后终于找到解决办法,特在此记录下. ...
- 解决嵌套在ScrollView中的TableView滑动手势冲突问题
最近在迭代开发公司项目的时候遇到了一个问题,在可以左右切换标签视图的ScrollView中嵌套了两个TableView用于展示视图,感觉一切so easy的情况下,问题出现了,因为左右两个视图既可以实 ...
随机推荐
- C#文件的压缩和解压(ZIP)使用DotNetZip封装类操作zip文件(创建/读取/更新)实例
需要引用Ionic.Zip命名空间 DLL下载地址在这里:http://dotnetzip.codeplex.com/ 文件压缩 /// <summary> /// 压缩ZIP文件 /// ...
- Android用户界面设计:基本button
Android用户界面设计:基本button 本文向你展示了在你的Android应用程序中创建一个简单的Button或ImageButton控件的步骤. 首先.你会学到怎样向你的布局文件里加入butt ...
- eImage(仅两行代码实现输出从数据库中查询到的二进制字段)标签
功能: 专门用于向浏览器输出从数据库中查询到的二进制字段.支持通用的几十种文件类型 别名为edoc 使用方法: <chtml><eimage id=书包名type=类型>key ...
- Python——list切片
前文简单介绍了Python中的list和它常用的一些函数,知道list是一个有序的数据集合,那么我们如何获取list中的元素呢? Index: 与C语言中数组一样,list可以通过每个元素的index ...
- 十天学习PHP之第二天
学习目的:学会构建数据库 在ASP中,假设是ACCESS数据库你能够直接打开ACCESS来编辑MDB文件,假设是SQL SERVER你能够打开企业管理器来编辑SQL SERVER数据库.可是在PHP ...
- C#令人迷惑的DateTime:世界标准时间还是本地时间?
先来看一段代码: 复制内容到剪贴板程序代码 DateTime time = DateTime.Parse("2013-07-05 00:00:00");Console.WriteL ...
- Chrome浏览器V43版本号不支持silverlight 5.0的解决的方法
场景: 浏览器:chrome V43 插件:silverlight 5.0 操作系统:xp 问题: 自己开发silverlight站点在IE7和firefox中能正常打开,但在chrome中打开失败. ...
- 设计模式学习笔记——Prototype原型模式
原型模型就是克隆. 还有深克隆.浅克隆,一切听上去都那么耳熟能详.
- base64 hash sha
/*! * Crypto-JS v1.1.0 * http://code.google.com/p/crypto-js/ * Copyright (c) 2009, Jeff Mott. All ri ...
- Hadoop spark mongo复制集
启动hadoop cd /usr/local/hadoop/hadoop $hadoop namenode -format # 启动前格式化namenode $./sbin/start-all.sh ...