详解H5新特性

H5是为了让移动设备支持多媒体

新特性:

1.新表单元素引入

input元素及type属性

<input type="email" />
//type属性:
  email
  url
  number
  range
  color
  date
  month
  week
  time

form属性

autocomplete=" on | off " //自动完成(历史内容记忆)
novalidate=" on  | off "    //关闭表单校验

input属性

autofocus:自动获取焦点
form:form元素外制定与哪个form一并提交(form的值为“目标form的id”)
list:绑定input的下拉内容,list的值为目标元素的id 目标元素为
<datalist id="aaa">
  <option></option>
</datalist>
multiple:select加此属性可多选
placeholder:文字提示内容
required:必填

2.新语义标签的引入

<header></header>
<nav></nav>
<section></section>
<footer></footer>
<article></article>

但是这些新语义标签在低版本IE浏览器中兼容性很差,以下是IE低版本兼容解决方案

<!--[if lte IE 8]>
  <script type="text/javascript" src="../html5shiv.min.js"></script>
<![endif]-->

3.多媒体控件

<video></video>
<audio></audio>
属性:controls显示多媒体控件
属性:autoplay自动播放
属性:loop设置循环播放

4.canvas标签
5.本地数据库
6.一些API

好处:

1、跨平台(可嵌入各种平台)

缺点:

1、兼容性不好

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 前端开发知识点 HTML&CSS对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功:布局、盒子模型...
    Hebborn_hb阅读 858评论 0 1
  • 一:在制作一个Web应用或Web站点的过程中,你是如何考虑他的UI、安全性、高性能、SEO、可维护性以及技术因素的...
    Arno_z阅读 1,276评论 0 1
  • 一、HTML5 1.1 认识HTML5 HTML5并不仅仅只是作为HTML标记语言的一个最新版本,更重要的是它制定...
    福尔摩鸡阅读 16,204评论 14 51
  • 1.行内元素和块级元素?img算什么?行内元素怎么转化为块级元素? 行内元素:和有他元素都在一行上,高度、行高及外...
    极乐君阅读 2,526评论 0 20
  • 22、JQ的基础语法、核心原理和项目实战 jQ的版本和下载 jQuery版本 1.x:兼容IE6-8,是目前PC端...
    萌妹撒阅读 1,781评论 0 0