1.html5语法的改变
HTML5简化了很多细微的语法,例如:
1.1doctype的声明;
html4:
html5:
1.2字符编码:
html4:
html5:
HTML5的语法兼容HTML4和XHTML1,但不兼容SGML(标准通用标记语言)。html5有向下兼容
的特性,他可以完整的显示html4的内容;
1.3元素标记
不允许写结束标记的元素:br、embed、hr、img、input、link、meta、param。正确格式:<元素/>
1.4具有boolean值的属性
1.5省略引号
2.全局属性(所有标签都可以使用的属性)
1.contentEditable属性.允许用户对文本进行编辑,是布尔值类型,true为可编辑,false为不可编辑,默认为true 2.designMode属性.规定页面是否可编辑,值为on/off,on为页面可编辑,off页面不可被编辑,必须在javascript中使用 3.hidden属性 4.spellcheck属性.针对input和textarea标签的文本拼写语法检查,拼写错误会提示 5.tabindex属性.规定按tab键之后的选择顺序,默认按tab键对链接元素和form表单有用, 通过tabindex属性可以使其他标签也可以按Tab键获取焦点,值为-1不会获取焦点
3.HTML5新增元素
3.1 新增的主体结构元素:artical,aside,section,nav,time,pubdate元素
artical标签通常表示文档,页面中独立的部分,一篇博客,文章或其他独立的部分,通常可以用来表示插件,可嵌套
这里是标题
文本段落
这里是评论区域
正文在这里
aside标签通常表示当前页面或文章的附属信息,侧边栏,广告弹出框等,一个独立的部分
section内有标题有内容,强调分块或分段
标题
内容
nav主要用来做页面导航
time元素表示时间
pubdate表示发布时间
3.2 新增的非主体结构元素:address、header、hgroup、footer元素
address元素用来在文档中呈示联系信息,包括联系人,联系地址,邮箱,电话等联系信息
header元素(一个页面可以有多个):
hgroup标签用于归类同一个标题下的子标题
大标题
小标题
这是正文
footer元素:
网页排版:
大标题
大标题
小标题
文本正文
评论标题
评论内容
4.HTML5新增表单元素与属性
form属性:
formaction属性:
formmethod属性:
formtarget属性:
formenctype属性:
autofocus属性:
required属性:
list元素:
下拉菜单:
control属性:
control属性
创建节点:
- Coffee
- Tea
请点击按钮向列表插入一个项目。
注释:
首先请创建一个 LI 节点,然后创建一个文本节点,然后向这个 LI 节点追加文本节点。最后在列表中的首个子节点之前插入此 LI 节点。labels节点:
labels节点
placeholder属性:
autocomplete标签:
注释:autocomplete 属性适用于 <form>,以及下面的 <input> 类型:text, search, url, telephone, email, password, datepickers, range 以及 color。
image标签的宽高属性:
checkbox属性:
选中测试
pattern正则表达式:
selectionDirection属性:
5、HTML5 改良的 input 元素的种类
5.1表单验证
5.2 type类型
+ =Title
5.3计算器
+=
5.4 radio单选按钮的使用
6、新增的页面元素
6.1 cite元素
cite元素
我最近想看电影功夫瑜伽
6.2 small元素
这里可以写版权等
6.3 details元素和summary元素
好看是电影在这里
我就是好看的电影
6.4 figure元素
6.5 mark元素
谁比较突出,就是我
6.6progress元素
progress进度
完成的百分比
7.列表的使用
ul无序列表:
- html5
- css3
- javascript
ol有序列表:
- html5
- css3
- javascript
ol li ul嵌套列表:
- 动物
- 猫
- 狗
- 植物
- 花
- 草
- 生物
- 鱼
- 大树
dl自定义列表:
- 标题
- 注释
- 标题
- 注释
8.table表格
表头1 | 表头2 | 表头3 | 表头4 |
---|---|---|---|
单元格1 | 单元格1 | 单元格1 | |
单元格2 | 单元格2 | 单元格2 | 单元格2 |
单元格3 | 单元格3 | 单元格3 | |
单元格4 | 单元格4 | 单元格4 |
9.内联框架
iframe元素:
10.实体
带有特殊字符的标签不能被展现出来,要通过html实体的方式表达,如:
<html>表示
11.audio音频元素
12.video视频元素
13.拖放
请把图片拖放到矩形中:
14.web存储
之前,都是由cookie完成数据存储的,但是,cookie不适合大量数据的存储,因为它们由每一个对服务器请求来传递,使得cookie速度很慢且效率不高。
14.1localStorage数据存储
web存储1
14.2 sessionStorage数据存储
web存储2 0
15.canvas图形绘制标签
<canvas> 标签只是图形容器,必须使用脚本来绘制图形。
15.HTML5废除的元素
废除basefont、big、center、font、s、tt、u等元素,
不再使用frame框架