HTML5新增标签和属性

以之前小米商城的网页为例。
常用的新标签如下图所示：

header头部

示例图片如下图所示：

上图中被红线画起来的是头部部分。

nav导航栏链接的部分

图中被红线画起来的地方

footer:定义文档或节的页脚

图中被红线圈起来的地方就是

article:定义文章

section：定义文档中的节（section、区段）

定义区域。

上图所示：香槟金、樱花粉、磨砂黑这些都是

aside:定义其所处内容的之外的内容 侧边

下图中的这些都是上图中的总结

datalist标签：定义选项列表，请与input元素配合使用该元素

代码如下图所示：

上图代码： input中 list="star"是为了与下面的datalist链接的
datalist id=“star” 是用来实现和上面中的input链接

fieldset

field元素可将表单内的相关元素分组，打包。 与legend一起搭配使用

代码如下：

结果如下图：

HTML5中新增的input type属性

接下来以邮箱和自由拖动滑块为例：
代码如下：

结果如下图所示：

下面的有些属性就是和时间有关系的了，接下来以date和color为例子：
代码如下：

演示效果：

新增占位符焦点多选属性

placeholder这个属性值不同于value,这个value值用鼠标点击后不会消失，而placeholder值是灰色的，用鼠标点击后会消失。
第二个属性autofocus 比如百度的那个页面，当直接跳转到这个页面时，光标会自动跳转到那个input框。

代码如下图所示：

或者是可以直接这样：

接下来说下第三个multiple 可以进行多文件上传。这个写法和上面的autofocus写法一样的。两种情况都可以。
代码及结果如下：


按住ctrl键可以选择多个元素。
下一个标签属性：autocomplete,这个标签属性可以记录之前输入的信息。比如在输入用户名的时候，就会记录下来。当然只有在提交之后才会有记录。
注意事项：
1.autocomplete首先需要提交按钮。
2.必须给定一个name值
代码及结果如下：

内容不能为空和获得焦点属性

有两个属性，一个是required 这个是必填项，内容不能为空。
还有一个是accesskey 这个规定快捷键，如果是accesskey=“s” 那就是按住alt+s
代码及效果如图所示：

下图是必填项的那个。

还有一个是快捷键，按住alt+s,鼠标光标就会直接跳转到昵称那个栏中。