html5那些事儿
一、优势
1、标签的改变:<header>,<footer>,<dialog>,<aside>,<figure>,<section>等;
2、代码简洁,开发游戏,移动开发工具;
3、标准未定,浏览器兼容性问题。
二、svg和canvas
1、svg
svg可以单独作为文件打开,在AI里做矢量图形,保存图层路径,即可另存为Svg文件。
path语法:命令+参数。大写字母表示坐标参数为绝对位置,小写字母表示坐标参数为相对位置(即上次画笔结束后的位置)。
Svg画椭圆:M200 200 A 200 100 0 0 1 300 300。初始位置,x半径,y半径,旋转角度,选弧长较短,顺时针,结束位置。
2、canvas
Canvas是基于状态,而不是基于对象画图。它提供容器,配合JS后,才能在页面展现图形。Canvas最好写行内样式,宽高不加单位。
三、自定义数据属性
<div id ="user" data-uid="2009" data-uname="camille" > </div>
1、使用getAttribute获取data-属性
var user = document.getElementById('user');
var userName = user.getAttribute('data-uname'); // userName = 'camille'
var userId = user.getAttribute('data-uid'); // userId = '2009'
2、使用setAttribute设置data-属性
user.setAttribute('data-age' , '100');
四、语义化标签
HTML5Shiv解决ie旧版本不支持h5新元素,浏览器小于IE9时会加载html5shiv.js文件。你必须将其放置于<head>元素中,让CSS样式应用在未知元素上只需执行document.createElement(elementName) 即可实现。
<!--[ifltIE9]>
<script type="text/javascript" src="scripts/html5shiv.js"></script>
<![endif]-->
五、一些新标签
可以通过html和css实现树形结构,下拉菜单,展开更多,不用js。
2、datalist
搜索下拉框。
html5那些事儿的更多相关文章
- WeX5与阿里内测的Weex与有何纠葛?快来看HTML5开发圈那些逗逼事儿!
4月21日~23日,由infoQ主办的2016 Qcon大会北京站如期举行. HTML5开发已经成为移动开发/前端专题中无可争议的焦点,核心议题已经由前几年的是否该用HTML5转向了如何高性能.高效率 ...
- HTML5 程序设计 - 使用HTML5 Canvas API
请你跟着本篇示例代码实现每个示例,30分钟后,你会高喊:“HTML5 Canvas?!在哥面前,那都不是事儿!” 呵呵.不要被滚动条吓到,很多都是代码和图片.我没有分开写,不过上面给大家提供了目录,方 ...
- setTimeout那些事儿
一.setTimeout那些事儿之单线程 一直以来,大家都在说Javascript是单线程,浏览器无论在什么时候,都且只有一个线程在运行JavaScript程序. 但是,不知道大家有疑问没——就是我们 ...
- Javascript中关于cookie的那些事儿
Javascript-cookie 什么是cookie? 指某些网站为了辨别用户身份.进行session跟踪而储存在用户本地终端上的数据(通常经过加密).简单点来说就是:浏览器缓存. cookie由什 ...
- CSS知识回顾--读《CSS 那些事儿》笔记
由于之前有了解过CSS的相关知识,有了一定的基础,所以读起<CSS 那些事儿>不是很有难度,况且我现在读起来时,CSS3和HTML5比较流行,这里只是记录一些CSS知识记录,不做详细铺开, ...
- (转) 浅析HTML5在移动应用开发中的使用
(转)浅析HTML5在移动应用开发中的使用 (原)http://www.iteye.com/magazines/67 2012-03-07 来自 UECD.163.com 编辑 wangguo ...
- [转] Android 4.4中播放HTML5视频<video>的Bug
近期Nexus 4手机自动升级到Android4.4,本来挺好的一件事儿,结果发现自己的应用中出现一个Bug,应用中使用了Webview播放HTML5视频,代码如下: <video width= ...
- html5 postMessage解决跨域、跨窗口消息传递
一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经常会遇到的问题 1.页面和其打开的新窗口的数据传递 2.多窗口之间消息传递 3.页面与嵌套的iframe消息传递 4. ...
- HTML5在移动端开发的12大特性
1.离线缓存为HTML5开发移动应用提供了基础 HTML5 Web Storage API可以看做是加强版的cookie,不受数据大小限制,有更好的弹性以及架构,可以将数据写入到本机的ROM中,还可以 ...
随机推荐
- HDU 1422 重温世界杯 DP题
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1422 解题报告:DP题,要使旅行的城市最多,关键是要选出一个城市作为开始,以这个城市作为开始的城市时, ...
- HDU 4690 EBCDIC 2013 Multi-University Training Contest 9
解题报告:一个模拟题,有两张表格,然后输入一个字符在第一章表格中的位置,让你找出这个字符在第二章表对应的位置. 我欧诺个的是暴力打表,输了两百多个数字,时间复杂度直接降到O(1),这题觉得比较坑的就是 ...
- 用threading和Queue模块实现多线程的端口扫描器
一.Queue模块基础 q = Queue.Queue() q.qsize() 返回队列的大小 q.empty() 如果队列为空,返回True,反之Fals ...
- const与指针
C++中const与指针 1.常指针: ; int * const pInt = &x; 其中PInt是常指针,pInt的值无法改变,但其指向的内容可以改变. 2.指向常量的指针 有两种写法: ...
- 脚本病毒分析扫描专题1-VBA代码阅读扫盲、宏病毒分析
1.Office Macor MS office宏的编程语言是Visual Basic For Applications(VBA). 微软在1994年发行的Excel5.0版本中,即具备了VBA的宏功 ...
- Linux下简单粗暴使用rsync实现文件同步备份【转】
这篇来说说如何安全的备份,还有一点不同的是上一篇是备份服务器拉取数据,这里要讲的是主服务器如何推送数据实现备份. 一.备份服务器配置rsync文件 vim /etc/rsyncd.conf #工作中指 ...
- Nodejs 发送邮件
var nodemailer = require("nodemailer");var mailTitle='http://bemupa.forumieren.com:Best Mu ...
- asp.net 伪静态实现(UrlRewritingNet)
UrlRewritingNet.UrlRewriter源码地址 https://github.com/aspnetde/UrlRewritingNet部署步骤: 步骤一: <!--只允许存在一个 ...
- 动态RNN和静态RNN区别
调用static_rnn实际上是生成了rnn按时间序列展开之后的图.打开tensorboard你会看到sequence_length个rnn_cell stack在一起,只不过这些cell是share ...
- java基础70 负责静态的网页制作语言XML(网页知识)
HTML:负责网页结构的CSS:负责网页的样式(美观)JavaScript:负责客户(浏览器)端与用户进行交互 1.HTML语言的特点 1.由标签组成 2.语法结构松散 3.大小写不区分 ...