一、HTML快速入门
说明：所有加*号内容代表不常用，了解即可。
HTML概述
超文本：Web是一个超文本的集合；超文本是web的基本组成单元，也成为网页或HTML文档，Web页等，通常以.html或.htm为后缀的文件；文件通过超链接组织在一起。
HTML: 超文本标记语言HTML基础语法
标记语法：HTML用于描述功能的符号称为“标记”，比如<p>标记在使用时必须用尖括号括起来，有封闭和非封闭标记（空标记）。
元素：即标记，每一对尖括号包围的部分，元素可以包含文本内容和其他元素。
属性和值：属性用来修饰元素，属性声明必须位于开始标记里，用空格隔开，不分先后顺序；每个属性都有值。如<p align="center"></p>
标准属性：或通用属性。id、title、class、style
注释：1、<!--注释部分-->注释之间的任何内容不会显示在浏览器中 2、注释不可以嵌套在其他注释中；3、注释不可以嵌在<>中。
HTML和XHTML：1999年12月，W3C推荐标准HTML4.01;XHTML于2000年1月成为W3C标准，是更严格更纯净的HTML版本。比如双标记必须关闭。
HTML5：目标是更简洁的HTML代码，如<input type="text" readonly="readonly"/>,等于后的相同部分可以去掉。并保证兼容性。
3、HTML文档结构
文档类型声明+hmtl页面（文件头+文件主体）
1、文档类型声明：HTML5 <!DOCTYPE HTML>2、文档结构：<!DOCTYPE HTML> <html> <head> </head> <body> </body> </html>
二、HTML内容
1、文本
1、特殊字符：空格、制表符、换行会被压缩成一个空格
转义字符： << , >> , 空格, ©版权符号 。
2、文本样式：对文本的修饰【一般不太建议使用这些元素来定制文档的外观，而建议使用CSS样式来实现外观的定义】
-<b>..</b>加粗
-<i>..</i>倾斜
-<u>..</u>下划线
-<s>..</s>删除线
-<sup>..</sup>上标
-<sub>..</sub>下标
3、标题元素<h1>-<h6>
4、换行元素<br/>
5、分割线元素<hr>：常用属性：size、width、align、color
6、预格式化元素：<pre>..</pre>，保留原文档格式
7、段落元素(块级元素)<p></p>
<p>元素提供了结构化文本的一种方式。
之间的文本会用单独的段落显示，-与前后文本换行分开，-添加一段额外的垂直空白距离，作为段间距，-常用属性-align。
8、分区元素<span>和<div>:分区元素用户为元素分组，常用与页面布局
-块级分区元素：<div></div>
-行内分区元素：<span></span>,设置同一行文字内的不同风格如：<p>一周畅销<span>榜</span></p>
9、行内元素与块级元素
-块级元素：默认情况下，块级元素会独占一行，即元素前后自动换行，如：<p>，<div>,<hn>
-行内元素：不会换行，可以和其他行内元素位于同一行，如：<span>,<b>,<i>,<u>
2、图像和链接
1、<img/> 必须元素：src,常用 width height
2、<a href="#" target="" name="">文本</a> href:链接url target:目标 可取_blank,_self等 name：描点名称
锚点：文档中某行的一个记号，用于连接到文档的某个位置
1、定义锚点：<a name="here">锚点一</a>
2、链接到锚点：在锚点前加#。<a href="#here">链接到锚点一</a>或<a href="页面url#here">链接到锚点一</a>
3、链接类型：
普通超链接：<a href="" target="">文本</a>
下载链接：<a href="DAY02.zip">下载</a>
电子邮件链接，用于链接到 email：<a href="mailto:tarena@tarena.com.cn">联系我们</a>
空链接，用于返回页面顶部：<a href="#">...</a>
链接到JavaScript，以实现特定的代码功能：<a href="javascript : ⋯">JS 功能</a>
3、表格
作用:用来组织结构化的信息。
元素及常用属性：<table> : width height align border cellspacing cellpadding bgcolor
<tr>:align valign
<td>:colspan rowspan
<caption>:定义标题，居中显示，紧跟table之后，只能有一个
表头:<thead> 表主体<tbody> 表尾<tfoot>
表格可跨行、跨咧、嵌套。
4、结构标记
经常使用<div>设计页面大致布局。
HTML5提供了结构标记：<header>页头 <nav>导航 <section>主体 <footer>页脚 <aside>边栏 <article>其他
5、列表
作用：将具有相似特征或先后顺序的几行文字进行对齐排列，所有的列表都由列表类型和列表项组成。
-列表类型：<ol>有序列表，<ul>无序列表。
-列表项：<li> 具体的列表内容
列表可以嵌套
<ol type="列表类型：1，a，A，i，I" start="起始编号">
<li></li>
</ol>
<ul type="列表类型：disc圆心 circle空心圆 squren 实心矩形">
<li></li>
</ul>
定义列表<dl>：<dl>
<dt>术语名称</dt>
<dd>对术语的解释</dd>
</dl>
-其他说明：ul里只能嵌套ul和li,不能嵌套<span>等其他东西。可以嵌套在li里。
6、表单
作用：用于显示收集信息，并提交的服务器。
表单元素<form>：用<form></form>标记
主要属性:
-action:定义表单被提交时的动作，通常包含服务方脚本的url
-method:表单数据提交方式，get/post
-enctype:表单数据编码方式
-name：表单名称
表单控件：表单可以包含很多表单控件，是包含在表单中具有可视化外观的HTML元素，用于访问者输入信息。
-input:文本输入控件、按钮、单选和复选按钮、选型框、文本选择框和隐藏控件等。
-textarea:
-select和option元素
-<label></label>
1、<input/>元素主要属性：
-type控件类型,
-value控件的数据，
-name控件名称
-disabled禁用控件
【name和vaule:提交时需要名称和值，键值对，值也可能是内容】
type类型：
1、文本和密码框：type="text/password"，
主要属性：name:名称，vaule访问者输入的文本，maxlenght最大长度，readonly只读
2、单选框和复选框：type="radio/checkbox"，
主要属性：name:设置名称并用于分组，一组单选或复选框的名称必须相同
value：文本，提交时如果选择了该按钮，value会被发送到服务器端
checked:默认被选中
3、按钮：type="submit/button/reset"
主要属性：name:名称 value：按钮的文本
4、隐藏和文件：type="hidden/file"
2、<label>元素主要属性：for:表示与该元素相联系的id值，作用：将文本与控件联系在一起，单击文本就如同单机控件一样。
或者用label标记阔住input
例：<input type="checkbox" name="n" id="id"/>
<label for="id">呵呵呵</label>
3、<select>元素主要属性：
-name：选择框名称
-size:大于1，则为滚动列表
-multiple:设置多选
<option>
-value:选中的值
-selected：被选中
4、<textarea>多行文本输入框：
-name:名称
-cols：文本框列数
-rows：文本框行数
-readonly:只读
为控件分组：<fieldset>:为控件分组
<legend>只定分组标题
例：<fieldset>
<legend>我是分组标题</legend>
<input/>
</fieldset>
其他常用标记：
1、浮动框架<iframe>：可以在窗口中同时显示多个页面文档。通过设置iframe的src属性指向其他页面url；
例：<iframe src="url">浏览器不支持iframe时，显示我</iframe>
2、摘要与细节<details>:目前只有chrome支持
例:<details>
<summary>点击我显示div中的详细信息</summary>
<div>我是隐藏的详情</div>
</details>
3、度量元素<meter>用户投票比例、磁盘使用比例、统计等。
例：<meter value="20" min="0" max="100" title="20%"></meter>
*4、时间元素：<time>
例：<time datetime="2015-05-02">二零一五年五月二日</time>
5、高亮显示：<mark>
例：<p>高亮<mark>显示<mark>文本</p>
