初识html5

---

前言

html5是html4的升级，语义化更明确。适用于移动端和PC端

1.兼容性处理

如果浏览器不识别html5，我们使用CSS Hack来做兼容性处理

代码如下（示例）：

<!--[IF lt IE 9]>
   <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
   <!-- 下面这个是国内的静态资源库  处理方案更好-->
   <script src="http://cdn.static.runoob.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->

2.新元素

• canvas 绘图元素
  用途：
  1.js可以使用canvas api来绘图
  2.canvas-cocos2d游戏引擎 ，做网页游戏开发，绘制网页特效

• 多媒体元素
  audio 音频播放器
  video 视频播放器

  属性：  autoplay  自动播放
          controls  控制器
          loop      循环播放
          muted     静音
  

• 新的表单元素 datalist
  这个元素和input得联用

<input type="text" list="ipt"/>
  <datalist id="ipt">
      <option>a</option>
      <option>ab</option>
      <option>abc</option>
      <option>abcd</option>
      <option>abcde</option>
      <option>abcdef</option>
  </datalist>

（文本框输入时还有联想功能）

• 表单更新的属性
  autocomplete on 开启表单输入智能提示 ； off 关闭智能提示（浏览器默认存在这个属性）

  novalidate 表单不验证

  autofocus 自动获得焦点

  表单上验证数据格式的 pattern="\d+" title=“请输入纯数字…”

• 新的结构元素（都是div）

  article  标签  定义相对页面独立的区域
  aside  标签  定义侧边栏的
  bdi  标签   定义相对文本独立（隔离  类似span）
  header  定义头部区域
  footer  定义底部区域
  nav  标签  定义导航
  sesstion  标签  定义区段标签
  

进度条：1.<meter value="10" max="100"></meter>

2.<progress value="20" max="100"></progress>