html5 画图 svg,HTML5 十大新特性(五)——SVG绘图
相对于canvas绘图，SVG是一种绘制矢量图的技术。全称叫做Scalable Vector Graphics，可缩放的矢量图，在2000年就已经存在，H5把它纳入了标准标签库，并进行了一些瘦身。需要注意的是，SVG图形的属性不属于HTML DOM标准，需要用核心DOM的方法来操作；SVG的样式可以用css，但是只能用其专有的属性；如果要使用js动态生成SVG其中的元素，创建方法得用document.createElementNS('http://www.w3.org/2000/svg','标签名')；SVG元素的nodeName都是纯小写形式。
一、使用方法
在HTML文件中直接使用SVG相关标签()即可，默认是一个300*150的inline-block。
二、绘制不同图形(部分)
1、绘制矩形
2、绘制圆形
3、绘制椭圆
4、绘制直线
5、绘制折线
6、绘制多边形
7、绘制文本
8、绘制图像
9、特效对象——渐变特效
10、特效对象——高斯模糊滤镜
HTML5 十大新特性(四)——Canvas绘图
H5引入了canvas标签,默认是一个300*150的inline-block.canvas的宽高只能用它自身的width和height属性来指定,而不能使用css样式中的width.height. ...
HTML5 十大新特性(二)——表单新特性
H5的表单新特性可以分为两大类. 一.10个input的type值 1.email:邮件输入域,在表单提交时提供简单的邮箱格式验证,并弹出一个提示窗口. 2.url:地址输入域,在表单提交时提供简单的 ...
HTML5 十大新特性(一)——语义标签
说语义标签前先来理解下什么叫语义化,当下html是靠div+css来铸造页面的整体框架和结构的,通篇大量的div可读性极低,因此诞生了这些特殊的标签,简单地说就是见名知义,使页面更清晰,方便维护和开发 ...
HTML5 十大新特性(十)——Web Socket
webSocket是H5新加的一个协议,为了解决http协议的request.response一一对应和它自身的被动性,以及ajax轮询等问题.一方可以发送多条信息,连接不中断,永久连接,但也导致了服 ...
HTML5 十大新特性(七)——拖放API
拖放API是H5专门为了鼠标拖放而新提供了7个事件,可以分成三个部分来讲. 一.拖动的源对象(source)可以触发的事件 dragstart:拖动开始 drag:拖动进行中 dragend:拖动结束 ...
HTML5 十大新特性(三)——视频和音频
一.视频(video) H5新加了video标签,用来播放视频,默认为一个300*150的inline-block. 二.音频(audio) H5新加了audio标签,用来播放音频,默认为一个300* ...
HTML5 十大新特性(九)——Web Storage
H5的webStorage技术一共提供了两个对象:window.sessionStorage和window.localStorage. 一.window.sessionStorage--会话级存储 存 ...
HTML5 十大新特性(八)——Web Worker
由于js是单线程的,所以H5添加了这个叫做webWorker的概念,允许js创建多个线程,但是子线程完全受主线程控制,且不能操作DOM,从而来处理一些比较耗时的操作. 那么如何创建一个子线程呢?通过这 ...
HTML5 十大新特性(六)——地理定位
简单地用一句话概括就是,使用js获取浏览器当前所在的地理坐标,实现LBS(Location Based Service,基于定位的服务). 下面写一下它的基本调用: if(navigator.geol ...
随机推荐
Prim POJ 2031 Building a Space Station
题目传送门 题意:给出n个三维空间的球体,球体是以圆心坐标+半径来表示的,要求在球面上建桥使所有的球联通,求联通所建桥的最小长度. 分析:若两点距离大于两半径和的长度,那么距离就是两点距离 - 半径和 ...
log4j常用配置以及日志文件保存位置
log4j.rootLogger=INFO,CONSOLE log4j.appender.CONSOLE=org.apache.log4j.ConsoleAppender log4j.appender ...
转：python webdriver API 之上传文件
文件上传操作也比较常见功能之一,上传功能操作 webdriver 并没有提供对应的方法,关键上传文件的思路.上传过程一般要打开一个系统的 window 窗口,从窗口选择本地文件添加.所以,一般会卡在如 ...
服务订单SO创建
FUNCTION Z_SD_SALESORDER_CREATE. *"------------------------------------------------------------ ...
(转)通过在 Page 指令或 配置节中设置 validateRequest=false 可以禁用请求验证
通过在 Page 指令或 配置节中设置 validateRequest=false 可以禁用请求验证 说明: 请求验证过程检测到有潜在危险的客户端输入值,对请求的处理已经中止.该值可能指示危及应用 ...
可能是讲解ARM中断和中断嵌套最通俗易懂的文章
几天前一个学生问我ARM中断嵌套的问题,我才发现原来在我心中理所当然的事对学生来说理解实属不易. ARM有七种模式,我们这里只讨论SVC.IRQ和FIQ模式. 我们可以假设ARM核心有两根中断引脚 ...
CMake set 语法
参考CMake官方文档:https://cmake.org/cmake/help/v3.14/command/set.html 1. 普通变量 set(
sourcetree 修改文件后提交上去，文件丢失
提交sourcetree 修改后,图片资源提交上去了,json文件没提交上去,原因是本地finder隐藏文件.gitignore_global中把一些文件类型都隐藏了不让提交. 具体使用default ...
leetCode题解寻找最短字符路径
1.题目描述 2.分析 最简单的方案,对每一个字符,向两边寻找. 3.代码 vector shortestToChar(string S, char C) { vector< ...