[TOC]
## 用例源码
[点击下载](http://pan.baidu.com/s/1bp1eGxD)
# 常见标签
~~~
<a> 定义超链接。
<h1> to <h6> 定义标题 1 到标题 6。
<b> 定义粗体文本。
<button> 定义按钮。
<hr> 定义水平线。
<br> 插入换行符。
<i> 定义斜体文本。
<label> 定义表单控件的标注。
<div> 定义文档中的节。
<img> 定义图像。
<small> 定义小号文本。
<span> 定义文档中的 section。
<strong> 定义强调文本。
<sub> 定义下标文本。
<sup> 定义上标文本。
<del> 定义删除文本。
<em> 定义强调文本。
<p> 定义段落。
<pre> 定义预格式化文本。
<iframe> 定义行内的子窗口（框架）。
<form> 定义表单。
<input> 定义输入域。
<textarea> 定义 textarea。
<select> 定义可选列表。
<option> 选择列表
<table> 定义表格。
<caption> 定义表格标题。
<thead> 定义表头。
<tbody> 定义表格的主体。
<tfoot> 定义表格的脚注。
<th> 定义表头。
<td> 定义表格单元。
<tr> 定义表格行。
<ul> 定义无序列表。
<ol> 定义有序列表。
<li> 定义列表的项目。
~~~
# 属性
~~~
style 规定元素的行内 CSS 样式。
class 规定元素的一个或多个类名（引用样式表中的类）。
Id 规定元素的唯一 id。
title 规定有关元素的额外信息。
data-自定义
~~~
# 事件
~~~
onblur 元素失去焦点时运行的脚本。
onchange 在元素值被改变时运行的脚本。
Onclick 元素上发生鼠标点击时触发。
ondblclick 元素上发生鼠标双击时触发。
~~~
# 示例1
~~~
<!doctype html>
<html>
<head>
<!--设置字符集-->
<meta charset="utf-8" />
<!--浏览器的标题-->
<title>title1111</title>
<!--样式-->
<style type="text/css"></style>
<!--脚本-->
<script type="text/javascript">
function demo_click(e) {
console.error(e, e);
}
</script>
</head>
<body>
<!-- > < -->
> <
<a title="title" target="_top" href="http://www.baidu.com">baidu</a>
<h1 onclick="demo_click('h1')">h1</h1>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>h6</h6>
<h7>h6</h7>
stdb <br />
<hr />
<b onclick="demo_click('b')">content</b>
<button onclick="demo_click('btn')">button</button>
<i title="">i</i>
<label id="">label</label>
<div>jjj</div>
<img style="height:200px;width:200px" src="DJI_0108.JPG" alt="bujianl" />
<small>small</small>
<span>span</span><p>p</p>
<strong>content</strong>
<sub>sub</sub>std<sup>sup</sup>
<del>del</del>
<em>em</em>
<pre>
int main(){
int i,j;
}</pre>
<iframe style="width:100%;height:500px;border:1px solid red" src="iframe.html" frameborder="0"></iframe>
</body>
</html>
~~~
* * * * *
# 示例2
#### 效果
~~~
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style>
table {
width: 400px;
height: 400px;
}
table td{
border:1px solid #679454;
}
</style>
</head>
<body>
<table>
<tr>
<td colspan="2">1</td>
<td rowspan="2">2</td>
</tr>
<tr>
<td rowspan="2">1</td>
<td>2</td>
</tr>
<tr>
<td colspan="2">1</td>
</tr>
</table>
</body>
</html>
~~~
