HTML5学习知识点

一、文档问题

1.html5新标签：section、header、footer、nav、aside、blockquote、q、fieldest、figure、address、article、details

2.在不支持Html5的浏览器中使用HTML5:浏览器关于未知元素的默认样式是display：inline；因此需要：

section,article,aside,footer,header,nav,hgroup{
    display:block;
}

由于ie8及ie8以前版本的浏览器不允许样式化不支持的元素，因此需加入：

<!--[if lt IE 9]>
  <script>
    document.createElement("header" );
    document.createElement("footer" );
    document.createElement("section");
    document.createElement("aside"  );
    document.createElement("nav"    );
    document.createElement("article");
    document.createElement("hgroup" );
    document.createElement("time"   );
  </script>
  <noscript>
     <strong>Warning !</strong>
     Because your browser does not support HTML5, some elements are simulated using JScript.
     Unfortunately your browser has disabled scripting. Please enable it in order to display this page.
  </noscript>
<![endif]-->

二、表单

1、type值：

1)search：元素呈现为搜索框，去除换行符；

2)tel:电话号码的输入控件，换行符会从输入值中去除；由于电话号码国际化差异明显，因此可以使用pattern和maxlength来控制输入限制；

3)url:元素呈现为一个编辑URL的输入控件，换行符和首尾空格都会被去除；

4)email：元素呈现为邮件地址，换行符被自动去除；

2、input的新特性

1)list:<datalist>元素的ID，该元素的内容，<option>被用作提示信息，会在input的建议区域作为提议显示出来,label会在后面提示；

<form action="">
    <input type="text" list="nameList">
    <datalist id="nameList">
        <option value="jonh" name="name" label="队长"></option>
        <option value="jonh" name="name" label="队长"></option>
        <option value="jonh" name="name" label="队长"></option>
    </datalist>
</form>