html基本结构：
<!DOCTYPE html>
<head>
</head>
<body>
</body>
</html>
在html中，标题是通过h1~h6等标签进行定义。请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。请使用其它标签或 CSS 代替。
段落是通过p标签定义。
链接是通过a标签定义。
图像是通过img标签定义。
<hr /> 标签在 HTML 页面中创建水平线
换行标签
用法：
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
<p>这是一个段落</p>
<!--href="网页地址" 创建指向另一个文档的链接-->
<a href="http://www.w3school.com.cn">
这是一个链接</a>
<br/>
<!--src="图片地址"-->
<img src="/i/eg_w3school.gif" width="300" height="120" /> <!--这是一张图片-->
</body>
</html>
style属性改变html的样式：
background-color 属性为元素定义了背景颜色。
font-family、color 以及 font-size 属性分别定义元素中文本的字体系列、颜色和字体尺寸。
text-align 属性规定了元素中文本的水平对齐方式。
<!DOCTYPE html>
<head>
</head>
<body style="background-color:blue">
<h1 style="text-align:center">标题</h1>
<p style="font-family:arial;color:red;font-size:20px;">段落</p>
</body>
</html>
html格式化：
文本格式化标签：
<b>定义粗体文本 </b>
<big> 定义大号字</big>
<em> 定义着重文字</em>
<i> 定义斜体字</i>
<small> 定义小号字</small>
<strong> 定义加重语气</strong>
<sub>定义下标字</sub>
<sup>定义上标字</sup>
<ins> 定义插入字</ins>
<del>定义删除字</del>
删除字和插入字效果：
<p>一打有 <del>二十</del> <ins>十二</ins> 件。</p>
“计算机输出”标签：
<code>定义计算机代码<code>
<kbd>定义键盘码</kdb>
<samp>定义计算机代码样本</samp>
<tt> 定义打字机代码</tt>
<var>定义变量</var>
<pre>定义预格式文本</pre>
<p>
这些标签常用于显示计算机/编程代码。
</p>
引用、引用和术语定义：
<abbr>定义缩写</abbr>
<acronym>定义首字母缩写</acronym>
<address>定义地址</address>
<bdo>定义文字方向</bdo>
<blockquote> 定义长的引用</blockquote>
<q>定义短的引用语</q>
<cite> 定义引用、引证<cite>
<dfn> 定义一个定义项目</dfn>
<code> 元素不保留多余的空格和折行，如需解决该问题，您必须在 <pre> 元素中包围代码：
<!DOCTYPE html>
<head>
</head>
<body>
<code>
var person = {
firstName:"Bill",
lastName:"Gates",
age:50,
eyeColor:"blue"
}
</code>
<code>
<pre>
var person = {
firstName:"Bill",
lastName:"Gates",
age:50,
eyeColor:"blue"
}
</pre>
</code>
</body>
</html>
html样式：
当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
当单个文件需要特别样式时，就可以使用内部样式表。你可以在 head 部分通过 <style> 标签定义内部样式表。
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
当特殊的样式需要应用到个别元素时，就可以使用内联样式。 使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>
<a href="/example/html/lastpage.html" style="text-decoration:none">
这是没有下划线的一个链接！
</a>
<style> 定义样式定义。</style>
<link> 定义资源引用。
<div> 定义文档中的节或区域（块级）。</div>
<span> 定义文档中的行内的小块或区域。</span>
html超链接：
语法：
<a href="http://www.w3school.com.cn/">Visit W3School</a>
html--Target属性：
使用 Target 属性，你可以定义被链接的文档在何处显示。
下面的这行会在新窗口打开文档：
<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>
html--name属性：
name 属性规定锚的名称。
你可以使用 name 属性创建 HTML 页面中的书签。书签对读者是不可见的。
当使用命名锚时，我们可以定位到想去的位置，这样使用者就无需不停地滚动页面来寻找他们需要的信息了。
<a href="#tips">点击这里，跳转到那么name="tips"那条语句显示的内容</a>
<a name="tips">基本的注意事项 - 有用的提示</a>
html图片：
格式：<img src="boat.gif" alt="Big Boat">，alt中的内容只有在图片加载失败才会显示。
背景图像：
<body background="/i/eg_background.jpg">
</body>
图像链接：
<p>
图像链接：
<a href="/example/html/lastpage.html">
<img border="0" src="/i/eg_buttonnext.gif" />
</a>
</p>
图像映射：
<body>
<p>点击图像上的星球,映射到对应图像上。</p>
<img
src="/i/eg_planets.jpg"
border="0" usemap="#planetmap"
alt="Planets" />
<map name="planetmap" id="planetmap">
<area
shape="circle"
coords="180,139,14"
href ="/example/html/venus.html"
target ="_blank"
alt="Venus" />
<area
shape="circle"
coords="129,161,10"
href ="/example/html/mercur.html"
target ="_blank"
alt="Mercury" />
<area
shape="rect"
coords="0,0,110,260"
href ="/example/html/sun.html"
target ="_blank"
alt="Sun" />
</map>
<p><b>注释：</b>img 元素中的 "usemap" 属性引用 map 元素中的 "id" 或 "name" 属性（根据浏览器），所以我们同时向 map 元素添加了 "id" 和 "name" 属性。</p>
</body>
<img> 定义图像。</img>
<map> 定义图像地图。</map>
<area 定义图像地图中的可点击区域。/>
shape和coords：是两个主要的参数，用于设定热点的形状和大小。形状有rect，circle，poligon三种。大小表示为：coords="x1, y1,x2,y2"。
html表格：
表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
<table> 定义表格</table>
<caption> 定义表格标题。
<th> 定义表格的表头。
<tr> 定义表格的行。
<td> 定义表格单元。
<thead> 定义表格的页眉。
<tbody> 定义表格的主体。
<tfoot> 定义表格的页脚。
<col> 定义用于表格列的属性。
<colgroup> 定义表格列的组。
表格的表头可横可竖
<body>
<h4>表头：</h4>
<table border="1">
<tr>
<th>姓名</th>
<th>电话</th>
<th>电话</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>垂直的表头：</h4>
<table border="1">
<tr>
<th>姓名</th>
<td>Bill Gates</td>
</tr>
<tr>
<th>电话</th>
<td>555 77 854</td>
</tr>
<tr>
<th>电话</th>
<td>555 77 855</td>
</tr>
</table>
</body>
跨行跨列：
<body>
<h4>横跨两列的单元格：</h4>
<table border="1">
<tr>
<th>姓名</th>
<th colspan="2">电话</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>横跨两行的单元格：</h4>
<table border="1">
<tr>
<th>姓名</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">电话</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
</body>
表格内也可以用标签：
<body>
<table border="1">
<tr>
<td>
<p>这是一个段落。</p>
<p>这是另一个段落。</p>
</td>
<td>这个单元包含一个表格：
<table border="1">
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>这个单元包含一个列表：
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>菠萝</li>
</ul>
</td>
<td>HELLO</td>
</tr>
</table>
</body>
单元格边距：
<body>
<h4>没有 cellpadding：</h4>
<table border="1">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>带有 cellpadding：</h4>
<table border="1"
cellpadding="10">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
</body>
表格背景颜色与图片；单元格的设置同表格一样但是是在td中设置：
<h4>背景颜色：</h4>
<table border="1"
bgcolor="red">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
<h4>背景图像：</h4>
<table border="1"
background="/i/eg_bg_07.gif">
<tr>
<td>First</td>
<td>Row</td>
</tr>
<tr>
<td>Second</td>
<td>Row</td>
</tr>
</table>
</body>
表格中排列(align属性)：
<table width="400" border="1">
<tr>
<th align="left">消费项目....</th>
<th align="right">一月</th>
<th align="right">二月</th>
</tr>
<tr>
<td align="left">衣服</td>
<td align="right">$241.10</td>
<td align="right">$50.20</td>
</tr>
<tr>
<td align="left">化妆品</td>
<td align="right">$30.00</td>
<td align="right">$44.45</td>
</tr>
<tr>
<td align="left">食物</td>
<td align="right">$730.40</td>
<td align="right">$650.00</td>
</tr>
<tr>
<th align="left">总计</th>
<th align="right">$1001.50</th>
<th align="right">$744.65</th>
</tr>
</table>
</body>
frame属性控制围绕表格的边框：
<body>
<p><b>注释：</b>frame 属性无法在 Internet Explorer 中正确地显示。</p>
<p>Table with frame="box":</p>
<table frame="box">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<p>Table with frame="above":</p>
<table frame="above">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<p>Table with frame="below":</p>
<table frame="below">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<p>Table with frame="hsides":</p>
<table frame="hsides">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
<p>Table with frame="vsides":</p>
<table frame="vsides">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
</body>
html列表：
无序列表：
<body>
<h4>Disc 项目符号列表：</h4>
<ul type="disc">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ul>
<h4>Circle 项目符号列表：</h4>
<ul type="circle">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ul>
<h4>Square 项目符号列表：</h4>
<ul type="square">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ul>
</body>
有序列表：
<body>
<h4>数字列表：</h4>
<ol>
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ol>
<h4>字母列表：</h4>
<ol type="A">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ol>
<h4>小写字母列表：</h4>
<ol type="a">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ol>
<h4>罗马字母列表：</h4>
<ol type="I">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ol>
<h4>小写罗马字母列表：</h4>
<ol type="i">
<li>苹果</li>
<li>香蕉</li>
<li>柠檬</li>
<li>桔子</li>
</ol>
</body>
嵌套列表：
<body>
<h4>一个嵌套列表：</h4>
<ul>
<li>咖啡</li>
<li>茶
<ul>
<li>红茶</li>
<li>绿茶
<ul>
<li>中国茶</li>
<li>非洲茶</li>
</ul>
</li>
</ul>
</li>
<li>牛奶</li>
</ul>
</body>
自定义列表：
<body>
<h2>一个定义列表：</h2>
<dl>
<dt>计算机</dt>
<dd>用来计算的仪器 ... ...</dd>
<dt>显示器</dt>
<dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>
</body>
<dl> 定义定义列表。</dl>
<dt> 定义定义项目。</dt>
<dd>定义定义的描述。</dd>
html块：
大多数 HTML 元素被定义为块级元素或内联元素。块级元素在浏览器显示时，通常会以新行来开始（和结束），例子：<h1>, <p>, <ul>, <table>。内联元素在显示时通常不会以新行开始，例子：<b>, <td>, <a>, <img>。
<span> 定义 span，用来组合文档中的行内元素。当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。
<div>
<p>我的母亲有 <span style="color:blue;font-weight:bold">蓝色</span> 的眼睛，我得父亲有 <span style="color:darkolivegreen;font-weight:bold">碧绿色</span> 的眼睛。</p>
</div>
