一、优势
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]-->

五、一些新标签

1、details,summary

可以通过html和css实现树形结构,下拉菜单,展开更多,不用js。

2、datalist

搜索下拉框。

html5那些事儿的更多相关文章

  1. WeX5与阿里内测的Weex与有何纠葛?快来看HTML5开发圈那些逗逼事儿!

    4月21日~23日,由infoQ主办的2016 Qcon大会北京站如期举行. HTML5开发已经成为移动开发/前端专题中无可争议的焦点,核心议题已经由前几年的是否该用HTML5转向了如何高性能.高效率 ...

  2. HTML5 程序设计 - 使用HTML5 Canvas API

    请你跟着本篇示例代码实现每个示例,30分钟后,你会高喊:“HTML5 Canvas?!在哥面前,那都不是事儿!” 呵呵.不要被滚动条吓到,很多都是代码和图片.我没有分开写,不过上面给大家提供了目录,方 ...

  3. setTimeout那些事儿

    一.setTimeout那些事儿之单线程 一直以来,大家都在说Javascript是单线程,浏览器无论在什么时候,都且只有一个线程在运行JavaScript程序. 但是,不知道大家有疑问没——就是我们 ...

  4. Javascript中关于cookie的那些事儿

    Javascript-cookie 什么是cookie? 指某些网站为了辨别用户身份.进行session跟踪而储存在用户本地终端上的数据(通常经过加密).简单点来说就是:浏览器缓存. cookie由什 ...

  5. CSS知识回顾--读《CSS 那些事儿》笔记

    由于之前有了解过CSS的相关知识,有了一定的基础,所以读起<CSS 那些事儿>不是很有难度,况且我现在读起来时,CSS3和HTML5比较流行,这里只是记录一些CSS知识记录,不做详细铺开, ...

  6. (转) 浅析HTML5在移动应用开发中的使用

    (转)浅析HTML5在移动应用开发中的使用 (原)http://www.iteye.com/magazines/67   2012-03-07  来自 UECD.163.com  编辑 wangguo ...

  7. [转] Android 4.4中播放HTML5视频<video>的Bug

    近期Nexus 4手机自动升级到Android4.4,本来挺好的一件事儿,结果发现自己的应用中出现一个Bug,应用中使用了Webview播放HTML5视频,代码如下: <video width= ...

  8. html5 postMessage解决跨域、跨窗口消息传递

    一些麻烦事儿 平时做web开发的时候关于消息传递,除了客户端与服务器传值还有几个经常会遇到的问题 1.页面和其打开的新窗口的数据传递 2.多窗口之间消息传递 3.页面与嵌套的iframe消息传递 4. ...

  9. HTML5在移动端开发的12大特性

    1.离线缓存为HTML5开发移动应用提供了基础 HTML5 Web Storage API可以看做是加强版的cookie,不受数据大小限制,有更好的弹性以及架构,可以将数据写入到本机的ROM中,还可以 ...

随机推荐

  1. 网摘关于BarCodeControl控件

    简介 BarCodeControl是一个用户制作条形码的控件. MicrosoftBarcodeControl9.0是可以在MicrosoftOfficeAccess窗体和报表中显示条码符号的Acti ...

  2. HDU 2058 The sum problem 数学题

    解题报告:可以说是一个纯数学题,要用到二元一次和二元二次解方程,我们假设[a,b]这个区间的所有的数的和是N,由此,我们可以得到以下公式: (b-a+1)*(a+b) / 2 = N;很显然,这是一个 ...

  3. 【译】第七篇 Integration Services:中级工作流管理

    本篇文章是Integration Services系列的第七篇,详细内容请参考原文. 简介在上一篇文章,我们创建了一个新的SSIS包,学习了SSIS中的脚本任务和优先约束,并检查包的MaxConcur ...

  4. 《区块链100问》第75集:大零币Zcash是什么?

    Zcash,全称Zero Cash,简称ZEC,中文叫大零币,研发者为Zooko Wilcox,诞生于2011年11月9日. 采用零知识证明机制提供完全的支付保密性,是目前匿名性最强的数字资产.零知识 ...

  5. 关于Java IO与NIO知识都在这里

    由于内容比较多,我下面放的一部分是我更新在我的微信公众号上的链接,微信排版比较好看,更加利于阅读.每一篇文章下面我都把文章的主要内容给列出来了,便于大家学习与回顾. Java面试通关手册(Java学习 ...

  6. trace spring

    package xx.com.aspect; import org.aspectj.lang.ProceedingJoinPoint; import org.aspectj.lang.annotati ...

  7. js中字符串的常用方法

    一.普通方法 1.字符方法 动态方法:1.str.charAt(index);  返回子字符串,index为字符串下标,index取值范围[0,str.length-1] 动态方法:2.str.cha ...

  8. 使用gradle编译安卓APK

    一.安装JDK 在安装Gradle之前需要先安装JDK,由于安装的是Gradle是4.4所以需要安装JDK1.8. 之前编译总是提示如下错误就是由于先安装的jdk1.7然后安装的1.8造成的,在Gra ...

  9. 无需编译app切换线上、测试环境

    在咱们测试过程中,经常需要切换测试环境和线上环境.大致有如下几个方案. 一.服务器地址编译到app中 此种方式需要在代码里保存两套配置,一套指向线上,一套指向测试.通过编译参数分别生成测试包.线上包. ...

  10. MySQL执行计划explain的key_len解析

    前言:当用Explain查看SQL的执行计划时,里面有列显示了 key_len 的值,根据这个值可以判断索引的长度,在组合索引里面可以更清楚的了解到了哪部分字段使用到了索引.下面演示中,表结构的合理性 ...