HTML5是针对HTML标准的第五次修订,其主要的目标是将互联网语义化,以便于更好地被人类和机器阅读,并同时提供更好地支持各种媒体的嵌入。
新增语义化标签
- section 类似div
- header 头部
- nav 导航栏
- main 内容块
- footer 脚注
- article 多定义文章
- figure 文档插图
- figcaption 图例说明 配合figure使用
- progress 进度条 有min ,max和value属性
- datalist 定义列表 注意list--id
- details 定义一小块区域 可以展开open和收起
- aside 定义和页面关联度较低的内容
- mark 标记
- time 定义时间
- output 输出内容
<!-- DataList:提供候选项,类似与select value值必须存在 list=id datalist的id必须对应-->
<input type="text" list='myList' name="name" value="" />
<datalist id="myList">
<option value="www.baidu.com">百度</option>
<option value="www.google.com">谷歌</option>
<option value="www.bing.com.cn">Bing</option>
<option value="www.bigg.com">Bigg</option>
</datalist>
<!-- Details: 描述显示文章细节,显示全文 添加open属性即为默认打开-->
<details open>
<summary>点击可以打开全文,你信吗?打开试试...</summary>
<p>
上当了吧,嘻嘻~ <br/>上当了吧,嘻嘻~ <br/>
上当了吧,嘻嘻~ <br/>上当了吧,嘻嘻~ <br/>
上当了吧,嘻嘻~ <br/>上当了吧,嘻嘻~ <br/>
</p>
</details>
新增表单元素
- email 必须输入email 验证是否有@
- number 必须输入数字
- url 必须输入带协议的地址
- color 选择颜色
- range 输入一定范围的数字 min/max/step
- 时间和日期
data 年月日
time 时--:--分
week --年-周
month --年-月
新增表单属性
*autocomplete : 是否开启自动完成功能 接收值为on | off
*autofocus:自动获取焦点
*novalidate: 指定此form表单下的所有表单元素不进行验证
*pattern (regexp):接收正则表达式
网友评论