Html
Html简介
HTML是英文 HyperText Markup Language 的缩写，它的意思是"超文本标记语言"，用它编写出文档的文件的扩展名是“.html”或“.htm”（微软的操作系统），他是可供浏览器解释浏览的文件格式。你可以使用记事本，写字板或者是专业的IDE如：Dreamweaver等等编辑工具来编写HTML文件。
HTML标记两端有两个符号“<”和“>”,这两个符号称为角括号。html标签通常是成对出现的，比如“<html>”和“</html>”，前一个是开始标记，后面的是结束标记，在开始和结束标记之间的的文本是元素内容。html标记是与大小写无关的，“<html>”和“<HTML>”所表示的意思的一样的。标记可以拥有自己的属性。属性他能够为页面上的HTML元素提供附加信息。
Html的文档结构
html的文档结构主要是有3部分组成的：
1.<html></html>
<html>标记用于html文件的最前面，用来表示html文件的开始。而</html>的标记则是放在html的最后面，用来表示html文件的结束，两个标记必须一起使用。
2.<head>和</head>
<head>和</head>构成html文件的头部部分，在此标记对之间可以使用<title> </title>和<script> </script>等等标记对，这些标记都是描述html文档相关信息的标记对，<head> </head>标记对之间的内容是不会在浏览器中的内容部分出现的。两个标记必须同时使用。
3.<body>和</body>
<body>和</body>是html文档的主体部分，在此标记可以包括“<p>”,“</p>”,“<h1>”,“<br>”等等众多的标记，他们所定义的文本，图片等等将会在浏览器的内容部分显示出来。两个标记必须一起使用。
META标记
META标记是html语言的head部分的一个辅助性的标记的，他位于head和title标记之间，他提供给用户不可见的信息。meta标记的用来为搜索引擎robots定义页面主题，或者是定义用户浏览器上的cookie;可以用于来鉴别作者，设置页面格式，标注内容提要和一些关键字，还可以设置页面的自动刷新以及等级等等。
TITLE标记
在头部的<head></head>中，有另一组标签<title></title>。打在<title></title>这里面的文字会出现在浏览器视窗最上面蓝色部分里，作为网页的主题。
实例：
<title>这是我的html页面</title>
文字上的分隔标记
或许你会发现这样一个问题：我们已经在记事本里排版排的很漂亮，为何通过浏览器查看是就变了样子，那是因为浏览器不像word,他不认识Enter键或者空格键，所以当你按多少次空格，浏览器都会当作没看见一样。
常用的分隔标记：
强制断行标记“<br>”
强制分段标记“<p>”
空格“ ；”
排版的标记
1.文字的置左，置右，置中
刚刚我们学过的分段标记“<p>”在加上一些简单的属性设定，就可以让其的文字置左，置右，置中。
2.置中标记
使用方法：
<center>内容</center>
3.保持原始数
使用方法：<pre>内容<pre>据格式标记
字体的标记
1.文字的置左，置右，置中
刚刚我们学过的分段标记“<p>”在加上一些简单的属性设定，就可以让其的文字置左，置右，置中。
2.置中标记
使用方法：
<center>内容</center>
3.保持原始数
使用方法：<pre>内容<pre>据格式标记
字体变化标记
使用：在文字标记中，对于文字的格式也有相当多的变化，如加粗，斜体等等。
<dfn>用于名词解释，斜体显示</dfn>
<sup></sup> 上标 <smap>用于字母序列等宽</smap>
<sub></sub> 下标
<em></em> 强调 <address>模拟信封上的字体</address>
<strong></strong> 加强
<s></s>删除线 <strike>删除线</strike>
<big>比默认字号大一号</big>
<small>比默认字号小一号</small>
<code>以等宽字体显示计算机程序代码</code>背景标记
使用：<body bgcolor="red" backgroud="bg.jpg">
例子1：
<html>
<head><title>背景颜色</title> </head>
<body bgcolor="red">
<font size="4" face="黑体" color="red">背景颜色</font>
</body> </html>
例子2：
<html>
<head><title>背景颜色</title> </head>
<body background="bg.jpg">
<font size="4" face="黑体" color="red">背景图片</font>
</body> </html>
分隔线标记
分隔线标记
使用:上一部分<hr>下一部分
例子：
<html>
<head>
<title>背景颜色</title>
</head>
<body>
abcdefg。<br>
<hr color="red" width="240" size="2" noshade>
higklmn。
</body>
</html>
IMG标记
使用：<img src="boy.jpg" alt="haha" align="left" border="0" height="56px" width="32px">
例子：
<html>
<head>
<title>图片</title>
</head>
<body>
<img src="boy.jpg" alt="haha" align="left" border="0“ height="56px" width="32px">
</body>
</html>
说明：向网页中插入图片。
序列标记
1.无序列表< ul>
2.有序列表 <ol>
3.自定义列表 <dl>
特殊字符
html中有很多特殊的字符是需要特殊的处理。
下面看几个特殊的字符处理：
转义字符
< < > > & & &qout; “ 空格
例子： <html>
<head><title>特殊的字符</title> </head>
<body>
<<br>><br>&<br> &qout;<br>
</body>
表格
表格的结构
1.<table>
<table>...</table>是用来在html页面上创建表格的。
2.<th>代表列名一般放在第一行
3.<tr>代表格的一行。
4.<td>用来定义表格的一列。
在默认情况下，表格是没有边框的，如果想要出现边框，就是用border属性。
表格的设置
表格的合并
input标签
<input />标签的 type分为：
text -文本框
button -按钮
submit-提交
reset-重置
password -密码
checkbox-多选
radio-单选
file -上传文件
date - 选取日、月、年
month - 选取月、年
week - 选取周和年
time - 选取时间（小时和分钟）
datetime - 选取时间、日、月、年（UTC 时间）
datetime-local - 选取时间、日、月、年（本地时间）
写法：<input type = “text” value=“”/>
4.1邮箱输入框
<input type="email" name="user_email" />
4.2数字输入框
<input type="number" name="points" min="1" max="10" />
4.3数字范围输入框（进度条）
<input type="range" name="points" min="1" max="10" />
4.4颜色选择框
<input type="color" name="colortext"/><br>
下拉列表及文本域
Select标签
<select>
<option value="qxz" selected/>请选择
<option value=“A”/>苹果
<option value=“B”/>香蕉
<option value=“C”/>橘子
<option value=“D”/>西瓜
</select>
TEXTAREA便签
<TEXTAREA ROWS="5" COLS="30" ></TEXTAREA >
表单
表单的用途
表单在网页上用来给访问者填写信息的，从而获得用户信息，使用网页进行交互的功能。一般是将表单设计在一个html页面中，当用户填写信息后做提交操作，于是表单的内容就会从客户端的浏览器上发送给服务器，经过服务器上的jsp或者ASP或者Cgi等处理后，再将用户所需的信息传送给客户端的浏览器上，这样网页就具有交互性了。
表单构成
<form></form>
<form></form>标记是用来创建一个表单，在标记之间一切都属于表单里的内容。
<from>标记具有action，metnod,target属性。 action属性是处理处理程序的程序名称。method属性是用来定义处理程序的从表单中获取信息的方法，通常有两种分别是GET和POST两种。
target属性用来制定目标窗口的。
表单的工作原理
1.访问者填写表单，并提交给web服务器处理；
2.在web服务器上的后台处理程序对提交后的数据进行处理；
3.后台处理程序处理完成后，会重新生成一个新的html页面发给客户端
框架
混合框架
<head>
<title>框架页示例</title>
</head>
<frameset rows="50%,50%">
<frame src="http://www.baidu.com">
<frameset cols="25%,75%">
<frame src="http://www.sina.com.cn">
<frame src="http://www.baidu.com">
</frameset>
</frameset>
多媒体标记音频
1、HTML4多媒体
<embed src="文件源" width="宽度" autostart="true" loop="true">
src 设置文件源
width 设置宽度
autostart 设置是否自动播放，如果是true就是自动播放，是flase不自动播放
loop 设置是否循环播放true就是循环播放，false就是不自动播放
2、HTML5多媒体
<audio src="G:\Media\霍比特人3：五军之战.mp4" controls="controls"></audio>
3、添加背景音乐
<bgsound src="明月几时有.mp3" loop=5>
多媒体标记视频
视频标签
<video src="G:\Media\霍比特人3：五军之战.mp4" width="320" height="240" controls="controls">
</video>
control 属性供添加播放、暂停和音量控件。
Ogg 文件，适用于Firefox、Opera 以及 Chrome 浏览器。
要确保适用于 Safari 浏览器，视频文件必须是 MPEG4 类型。
video 元素允许多个 source 元素。source 元素可以链接不同的视频文件。
层
层也可以添加事件和属性，请参考 第2节补充div+css3.txt
<div style="color:#00FF00">
<h3>This is a header</h3>
<p>This is a paragraph</p>
</div>