<ol>
<ol>元素表示有序列表，用于列出页面上有特定次序的项目
<ol>元素只能包含列表项元素<li></li>
<ol>属性：
type指定标识项类型：1数字（默认），a小写字母，A大写字母，i小写罗马数字，I大写罗马数字
start指定起始编号
无序列表<ul>
<ul>元素表示无序列表，用于列出页面上没有特定次序的项目；
<ul>元素只能包含列表项元素<li></li>；
<ul>属性：
type指定标识项类型：disc实心圆（默认），circle空心圆，square实心菱形，none不显示标识
列表嵌套
嵌套使用可以创建多层列表，常用于创建文档大纲和导航菜单等；
语义上规定下一级ul必须写在外层ul>li中，否则会影响后续CSS的定义
定义列表<dl>
用于给出一类事物定义情形
<dl>标记定义一个定义列表；
<dt>标记定义了定义列表中的术语；
<dd>标记定义列表中的术语提供定义
```
<dl>
	<dt>要解释的名词</dt>
	<dd>具体解释</dd>
</dl>
```

2 结构标记

2.1 概述

如果使用<div>元素设计页面的大致布局，当布局复杂时会出现大量<div>元素，相互嵌套会导致难以处理和维护页面；
HTML5提供结构标记专门用于标识常见结构，可以很方便地实现页面各部分划分，是的文档结构清晰明确，容易阅读；

<body>
	<header></header>
	<section></section>
	<footer></footer>
</body>

2.2 结构标记

<header>元素
<header>标签，用于定义文档的页眉；可以多次出现，为任何部分的头部定义；
<nav>元素
<nav>元素定义页面导航链接部分，用于包含表示链接的其他元素<nav>元素定义页面导航链接部分，用于包含表示链接的其他元素
<section>元素
<section>标签用于定义文档中的节，表示文档中一个具体组成部分；常用于为页面上内容分块；可以使用<header>元素为内容添加标题
<article>元素
<article>标签常用于定义与文字相关内容，论坛
<footer>元素
<footer>元素常用于定义网页底部内容,版权、解释说明、备案号
<aside>元素
<aside>元素常用于定义页面的额外组成部分

3 表单

3.1 表单概述

3.1.1 表单作用

表单用于显示、收集信息并提交至服务器；
表单有两个基本部分：
1.提供可视化的输入控件；
2.收集用户信息并提交给服务器；

前端：提供表单控件，与用户做交互的可视化控件；
后端：对提交数据进行处理(接口)

使用<form>元素创建表单；
在<form>元素中添加其他表单可以包含的控件元素;

3.1.2 表单元素<form>

form表单只会提交表单中具有属性name的元素，而异步提交数据是通过元素的id来获取的。
<form></form>
主要属性：
1）action：定义表单被提交时发生的动作，通常定义服务器处理数据的URL，默认提交给当前地址
2）method：指定表单数据提交方式；

get是默认值，明文提交（通过url地址传递），数据传递有大小限制2KB，安全性较低，常用于向服务器获取数据；
post隐式提交数据无大小限制，不通过url传递，常用于提交数据到服务器，参数放在请求主体form data中，安全性较高；
delete
put

3）enctype：表单数据进行编码的方式；
设置表单允许提交的数据

提交普通字符，不能带有特殊符号；enctype=“text/plain”
允许将任意字符提交给服务器；enctype=“application/x-www-form-urlencoded”
允许将文件提交给服务器；enctype=“multipart/form-data”

4）name：表单名称

3.1.3 表单控件

表单可以包含很多不同类型的表单控件;
表单控件元素是包含在表单元素中具有可视化外观的HTML元素，用于访问者输入信息；
input元素：文本输入控件、按钮、单复选按钮、选项框、文件选择框和隐藏控件
textarea元素
select 和option元素
其他元素

3.2 <input>元素

<input>元素用于收集用户信息；单标记，<input />
主要属性：
type：根据不同type属性值创建各种类型输入字段
value：控件的数据
name：控件的名称
disabled：禁用控件，无值属性

文本框与密码框
文本框<input type=“text”/>
密码框<input type=“password” />
主要属性：
name名称、value访问者自由输入的任何文本；
maxlength限制输入的字符数；
readonly设置文本控件只读，无值属性，允许数据提交；
placeholder 占位符，默认显示在控件上的文本，得到焦点即无效
单选框和复选框
单选框：<input type=“radio” />
复选框： <input type=“checkbox” />
<input type=“checkbox” name="" value="" checked/>
主要属性：
name设置名称，用于分组，同组框的名称必须相同
value：当提交form时，如果选中，该value被发送到服务器；不设置value将传递on
checked：设置默认被选中，无值属性
复选框属性name需要设置为数组形式才能接受多个数据
按钮
按钮<input type=""/>
submit：提交按钮，传送表单数据给服务器端或其他程序处理
reset：重置按钮，清空表单内容，设置为默认值；
button：无功能按钮，属性onclick调用js脚本；
主要属性：name名称、value文本
H5定义<button> <button/>同时具备submit和button的特点
隐藏域
隐藏域：<input type=“hidden”/>在表单中包含不希望用户看见的信息
主要属性：name名称、value值；
文件选择框
文件选择框：<input type=“file” />
主要属性：name名称
注意：method=“post” , enctype=“multipart/form-data”, 无值属性multiple设置多个文件上传，name属性也要设置为数组类型

3.3 其他控件

<label>元素
语法：<label></label>
for表示与label相联系的控件的ID值，将文本与控件联系在一起，单击文本，效果等同单击按键
<input type=“checkbox” name=“chkHid” id=“chkHid”/>
<label for=“chkHid”>文本<label>
选项框
下拉选项框和滚动列表
<select>创建选项框
name：选项框命名；
size：定义显示选项的数量，默认为1，大于1则为滚动列表；
multiple：设置多选，忽略size属性成为滚动列表，属性name需要改为数组保存；
<option>：选项
value：选项的值；
selected：预选中；
当option没有value属性，select的value为option的内容；当option有value属性，select的value为option的value
```
<select size="">
	<option value="">\</option>
</select>
```
<textarea>元素
多行文本输入框<textarea></textarea>
主要属性：
name：名称；cols：指定文本区域的列数,以英文字母为准；rows：指定文本区域的行数；readonly：只读
由于列数实际应用中不准确，故项目中很少使用
控件分组
<fieldset></fieldset>：为控件分组
<legend></legend>：分组标题
浮动框架<iframe>元素
在一个浏览器窗口同时显示多个网页;
<iframe>元素，设置属性src指向其他页面的URL；
<iframe></iframe>src网页URL，height/width用百分比和px调整，添加的文本内容将在浏览器不支持该元素时显示，frameborder=“0”，scrolling=“no”
用处：可以将网页固定不变的部分单独提取出HTML文件，在其他网页中用iframe重用；但是需要用js.dom计算窗口高度

4 H5新表单元素

4.1 新表单元素简介

4.2 新的input类型

电子邮件类型
输入Email地址的文本框：<input type=“email” />
验证Emai
搜索类型
输入搜索关键字操作的文本框：<input type=“search” />
快速清除文本框
URL类型
验证数据是否符合url绝对路径规范< input type=“url”/>
验证http://以及后面内容
电话号码类型
针对移动端输入，能够根据不同设备进行调整弹出九宫格键盘：<input type=“tel” />
数字类型
只能接受固定数字值：<input type=“number” />
属性：min、max阈值，step决定域所接受值递增或递减的步长，默认为1，value="10"设置默认值
不成熟，比如value初始值可以小于阈值
范围类型
允许用户选择一个范围的数值：<input type=“range” min=“10” max= “1000” value=“50” />
value:初始值，step：步长
颜色类型
预定义的颜色拾取控件：<input type=“color” />
日期类型
创建日期输入域：<input type=“date” />
周类型
与日期类似，但只能选择周：<input type=“week” />
月份类型
与日期类似，但只能选择月：<input type=“month” />

HTML5_2.列表&结构标记&表单

列表、结构标记、表单

1 列表

1.1 列表的作用

1.2 列表的使用