###锚点定位
<a href="#movie">
<h3 id="movie">
1.使用“a href=”#id名>“链接文本"</a>创建链接文本。
2.使用相应的id名标注跳转目标的位置。
### base 标签
base 可以设置整体链接的打开状态
base 写到<head> </head>之间
## 链接标签
<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>
href：用于指定链接目标的url地址，当为标签应用href属性时，它就具有了超链接的功能。 Hypertext Reference的缩写。意思是超文本引用
target：用于指定链接页面的打开方式，其取值有_self和_blank两种，其中_self为默认值，_blank为在新窗口中打开方式。
## 相对路径
1.图像文件和HTML文件位于同一文件夹：只需输入图像文件的名称即可，如<img src="logo.gif" />。
2.图像文件位于HTML文件的下一级文件夹：输入文件夹名和文件名，之间用“/”隔开，如<img src="img/img01/logo.gif" />。
3.图像文件位于HTML文件的上一级文件夹：在文件名之前加入“../” ，如果是上两级，则需要使用 “../ ../”，以此类推，如<img src="../logo.gif" />。
## 绝对路径
绝对路径
“D:\web\img\logo.gif”，或完整的网络地址，例如“http://www.itcast.cn/images/logo.gif”。
# 列表标签
## 无序列表 ul （重点）
无序列表的各个列表项之间没有顺序级别之分，是并列的。其基本语法格式如下：
样式
ul {
list-style: none; 取消列表自带的小点 默认的列表样式
}
<ul>
<li>列表项1</li>
<li>列表项2</li>
......
</ul>
1. <ul></ul>中只能嵌套<li></li>，直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
2.<li>与</li>之间相当于一个容器，可以容纳所有元素。
3. 无序列表会带有自己样式属性
## 有序列表 ol
<ol>
<li>列表项1</li>
<li>列表项2</li>
......
</ol>
所有特性基本与ul 一致。
## 自定义列表
定义列表常用于对术语或名词进行解释和描述，定义列表的列表项前没有任何项目符号。其基本语法如下：
<dl>
<dt>名词1</dt>
<dd>名词解释1</dd>
<dd>名词解释2</dd>
...
<dt>名词2</dt>
<dd>名词2解释1</dd>
<dd>名词2解释2</dd>
...
<dl/>
# 表格 table(会使用)
表格的现在还是较为常用的一种标签，但不是用来布局，常见处理表格式数据。
## 创建表格
在HTML网页中，要想创建表格，就需要使用表格相关的标签。创建表格的基本语法格式如下：
<table>
<tr>
<td>单元格内的文字</td>
...
</tr>
...
</table>
在上面的语法中包含三对HTML标签，分别为 <table></table>、<tr></tr>、<td></td>;，他们是创建表格的基本标签，缺一不可，下面对他们进行具体地解释。
1.table用于定义一个表格。
2.tr 用于定义表格中的一行，必须嵌套在 table /table标签中，在 table /table中包含几对 tr /tr，就有几行表格。
3.td /td：用于定义表格中的单元格，必须嵌套在<tr></tr>标签中，一对 <tr> </tr>中包含几对<td></td>，就表示该行中有多少列（或多少个单元格）。
4.<th></th>:表头标签，一般位于表格的第一行或者第一列，其文本加粗居中，设置表头很简单，只需用表头标签<th></th>代替单元格标签<td></td>即可.
5.<caption></caption>:表格标题
注意：
1. <tr></tr>中只能嵌套<td></td>
```
```
2. <td></td>标签，他就像一个容器，可以容纳所有的元素
```
## 表格属性
<table cellspacing = "0" border="2">
cellspacing是设置cell间的间距默认是2 border是表格的框线 cellpadding设置单元格内容与单元格边框之间的间距默认是1 align设置表格在网页中的水平对齐方式：left,right.center
## 表格结构
在使用表格进行布局时，可以将表格划分为头部、主体和页脚（页脚因为有兼容性问题，我们不在赘述），具体 如下所示：
<thead></thead>：用于定义表格的头部。
必须位于<table></table> 标签中，一般包含网页的logo和导航等头部信息。
<tbody></tbody>：用于定义表格的主体。
位于<table></table>标签中，一般包含网页中除头部和底部之外的其他内容。
## 合并单元格
跨行合并：rowspan 跨列合并：colspan
合并单元格的思想：
将多个内容合并的时候，就会有多余的东西，把它删除。 例如 把 3个 td 合并成一个， 那就多余了2个，需要删除。
公式： 删除的个数 = 合并的个数 - 1
<td colspan="3">合并之后的单元格</td>
## input 控件
在上面的语法中，<input />标签为单标签，type属性为其最基本的属性，其取值有多种，用于指定不同的控件类型。除了type属性之外，<input />标签还可以定义很多其他的属性，其常用属性如下表所示。input{border:0;outline:none;/去除蓝色边框/}这样就可以去除蓝色边框
<p>用户名 :<input type="text" value="test" /> </p> text单行文本框输入 value是设置默认文本值的
<p>密码 :<input type="password" maxlength="6" /> </p> password密码框输入 maxlength设置最大输入长度
<input type="radio" name="sex" checked="checked" />女 <input type="radio" name="sex" />男 radio单选框 如果是一组，通过相同的name来实现单选 , checked设置默认选择项
<p>复选框：<input type="checkbox"/>足球 <input type="checkbox"/>篮球 <input type="checkbox"/>羽毛球 </p> checkbox复选框
<input type="button" value="搜索按钮" /> button 普通按钮
<input type="submit" value="提交表单"/> submit提交按钮
<input type="reset" value="重置表单" /> reset重置按钮
<input type="image" src="22.png"/> <br /> image图像按钮
<input type="file" /> file 文件域 选择文件按钮
## label标签(理解)
label 标签为 input 元素定义标注（标签）。
作用： 用于绑定一个表单元素, 当点击label标签的时候, 被绑定的表单元素就会获得输入焦点
如何绑定元素呢？
for 属性规定 label 与哪个表单元素绑定。
<label>输入账号：<input type="text" /></label> 用lable直接进行包裹input就可以了
<label for="male">Male</label>
<input type="radio" name="sex" id="male" value="male"> 值lable绑定指定id的表单元素
## textarea控件(文本域)
如果需要输入大量的信息，就需要用到<textarea></textarea>标签。通过textarea控件可以轻松地创建多行文本输入框，其基本语法格式如下：
<textarea cols="每行中的字符数" rows="显示的行数">
文本内容
</textarea>
## 下拉菜单
使用select控件定义下拉菜单的基本语法格式如下
<select>
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
...
</select>
1.<select></select>中至少包含一对 <option></option>
2.<option selected = "selected">北京</option> 在option中定义 selected = "selected"时，当前项即为默认选中项。
## 表单域
在HTML中，form标签被用于定义表单域，即创建一个表单，以实现用户信息的收集和传递，form中的所有内容都会被提交给服务器。创建表单的基本语法格式如下：
<form action="url地址" method="提交方式" name="表单名称">
各种表单控件
</form>
1.Action在表单收集到信息后，需要将信息传递给服务器进行处理，action属性用于指定接受并处理表单数据的服务器的url地址。
2.method用于设置表单数据的提交方式，其取值为get或者post.
3.nam用于指定表单的名称，以区分同一个页面中的多个表单。
注意：每个表单都应该有自己表单域。
# HTML5新标签与特性
## 文档类型设定
-document
-HTML: sublime 输入 html:4s
-XHTML: sublime 输入 html:xt
-HTML5 sublime 输入 html:5
## 字符设定
-：HTML与XHTML中建议这样去写
-：HTML5的标签中建议这样去写
## 常用新标签
w3c 手册中文官网 : http://w3school.com.cn/
-header：定义文档的页眉 头部
-nav：定义导航链接的部分
-footer：定义文档或节的页脚 底部
-article：定义文章。
-section：定义文档中的节（section、区段）
-aside：定义其所处内容之外的内容 侧边
<header> 语义：定义页面的头部 页眉</header>
<nav> 语义：定义导航栏</nav>
<footer> 语义：定义页面顶部 页脚</footer>
<article> 语义：定义文章 </article>
<section> 语义：定义区域 </section>
<aside> 语义：定义其所处内容之外的内容 </aside>
-datalist 标签定义选项列表。请与 input 元素配合使用该元素
<input type="text" value="输入明星" list="star"/> <!-- input里面用 list -->
<datalist id="star"> <!-- datalist 里面用 id 来实现和 input 链接 -->
<option>刘德华</option>
<option>刘晓庆</option>
<option>张学友</option>
</datalist>
-fieldset 元素可将表单内的相关元素分组，打包 legend 搭配使用
<fieldset>
<legend>用户登录 <\legend> 标题
用户名: <input type="text"><br /><br />
密 码: <input type="password">
</fieldset>
## 新增的input type属性值：
<input type="email"> 输入邮箱格式
<input type="tel">输入手机号码格式
<input type="url">输入url格式
<input type="number">输入数字格式
<input type="search">搜索框（体现语义化
<input type="range">自由拖动滑块
<input type="time">小时分钟
<input type="date">年月日
<input type="datetime">时间
<input type="month"> 月年
<input type="week"> 星期 年
## 常用新属性
<input type="text" placeholder="请输入用户名"> 占位符 当用户输入的时候 里面的文字消失 删除所有文字，自动返回 |
<input type="text" autofocus> 规定当页面加载时 input 元素应该自动获得焦点
<input type="file" multiple> 多文件上传
<input type="text" autocomplete="off"> 规定表单是否应该启用自动完成功能 ,有2个值，一个是on 一个是off on 代表记录已经输入的值 1.autocomplete 首先需要提交按钮2.这个表单您必须给他名字
<input type="text" required> 必填项 内容不能为空
<input type="text" accesskey="s"> | 规定激活（使元素获得焦点）元素的快捷键 采用 alt + s的形式 |
## 多媒体标签
-embed：标签定义嵌入的内容
-audio：播放音频
-video：播放视频
### 多媒体 embed（会使用）
embed可以用来插入各种多媒体，格式可以是 Midi、Wav、AIFF、AU、MP3等等。url为音频或视频文件及其路径，可以是相对路径或绝对路径。
因为兼容性问题，我们这里只讲解 插入网络视频， 后面H5会讲解 audio 和video 视频多媒体。
优酷，土豆，爱奇艺，腾讯、乐视等等
1.先上传
2.在分享
<embed src="http://player.youku.com/player.php/sid/XMTI4MzM2MDIwOA==/v.swf" allowFullScreen="true" quality="high" width="480" height="400" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed>
### 多媒体 audio
<audiosrc="bgsound.mp3" autoplay controls loop = "-1" > </audio>
autoplay 自动播放
controls 是否显不默认播放控件
loop 循环播放 loop = 2 就是循环2次 loop 或者 loop = "-1" 无限循环
由于版权等原因，不同的浏览器可支持播放的格式是不一样的
多浏览器支持的方案:把音频文件转成三种格式的
为了浏览器兼容，我们需要三种声音文件 MP3 ogg wav
<audio controls autoplay>
<source src="bgsound.mp3" />
<source src="bgsound.ogg" />
<source src="bgsound.wav" />
您的浏览器不支持音频播放
</audio>
### 多媒体 video
<video src="mp4.mp4" autoplay controls> </video>
HTML5通过<audio>标签来解决音频播放的问题。当前，video元素支持的三种视频格式：Ogg, MPEG 4, WebM
<video autoplay controls>
<source src="mp4.mp4">
<source src="mp4.ogg">
<source src="mp4.webm">
</video>
