表格
<table
>
<caption
></caption
>//表格标题
<tr
>//行
<th
></th
>//表头
<td
></td
>//列
</tr
>
</table
>
属性
合并单元格
跨行合并：rowspan 跨列合并：colspan
划分结构
thead:头部 tbody:主体 tfoot:脚部
列表
无序列表
<ul
><li
></li
><ul
>
有序列表
<ol
><li
></li
></ol
>
自定义列表
<dl
><dt
>/dt
><dd
></dd
></dl
>
表单form
<form action="":提交服务器的地址 method:post/get:提交方式 name:名字></form>
input
<input type:类型 Value:值
>
属性
默认值：checked=“checked”
label
表单获得输入焦点 两种方法： 1、<label><input></label> 2、<label for="id">男</label> <input type name id>
文本域
<textarea
></textarea
> 一般用于留言板
Select下拉列表
<select><option></option></select> 默认值：selected=“selected”
案例
表格-小说排行榜
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小说排行榜
</title>
</head>
<body>
<table border="1" cellspacing="0" align="center" cellpadding="10">
<caption><b>小说排行榜
</b></caption>
<tr>
<th>排名
</th>
<th>关键词
</th>
<th>趋势
</th>
<th>今日搜索
</th>
<th>最近七日
</th>
<th>相关链接
</th>
</tr>
<tr>
<td>1
</td>
<td>鬼吹灯
</td>
<td><img src="images/down.jpg"></td>
<td>345
</td>
<td>123
</td>
<td><a href="#">贴吧
</a> <a>贴吧
</a> <a>贴吧
</a></td>
</tr>
<tr>
<td>2
</td>
<td>盗墓笔记
</td>
<td><img src="images/up.jpg"></td>
<td>124
</td>
<td>13
</td>
<td><a>贴吧
</a> <a>贴吧
</a> <a>贴吧
</a></td>
</tr>
<tr>
<td>3
</td>
<td>西游记
</td>
<td><img src="images/down.jpg"></td>
<td>212
</td>
<td>23
</td>
<td><a>贴吧
</a> <a>贴吧
</a> <a>贴吧
</a></td>
</tr>
<tr>
<td>4
</td>
<td>东游记
</td>
<td><img src="images/down.jpg"></td>
<td>23
</td>
<td>44
</td>
<td><a>贴吧
</a> <a>贴吧
</a> <a>贴吧
</a></td>
</tr>
<tr>
<td>5
</td>
<td>甄嬛传
</td>
<td><img src="images/up.jpg"></td>
<td>121
</td>
<td>56
</td>
<td><a>贴吧
</a> <a>贴吧
</a> <a>贴吧
</a></td>
</tr>
<tr>
<td>6
</td>
<td>水浒传
</td>
<td><img src="images/down.jpg"></td>
<td>100
</td>
<td>15
</td>
<td><a>贴吧
</a> <a>贴吧
</a> <a>贴吧
</a></td>
</tr>
<tr>
<td>7
</td>
<td>三国演义
</td>
<td><img src="images/up.jpg"></td>
<td>200
</td>
<td>54
</td>
<td><a>贴吧
</a> <a>贴吧
</a> <a>贴吧
</a></td>
</tr>
</table>
</body>
</html>
世纪佳缘
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>世纪佳缘
</title>
</head>
<body>
<table width="600px" align="center">
<caption>
<h3>青春不常在，抓紧谈恋爱
</h3>
</caption>
<tr>
<td>性别
</td>
<td>
<input type="radio" name="sex" checked="<checked></checked>" /> <img src="images/man.jpg" /> 男
<input type="radio" name="sex" /> <img src="images/man.jpg" /> 女
</td>
</tr>
<tr>
<td>生日
</td>
<td>
<select>
<option>--请选择年--
</option>
<option>1999
</option>
<option>1999
</option>
<option>1999
</option>
</select>
<select>
<option>--请选择年--
</option>
<option>1999
</option>
<option>1999
</option>
<option>1999
</option>
</select>
<select>
<option>--请选择年--
</option>
<option>1999
</option>
<option>1999
</option>
<option>1999
</option>
</select>
</td>
</tr>
<tr>
<td>所在地区
</td>
<td>
<input type="text" placeholder="请输入地区" />
</td>
</tr>
<tr>
<td>喜欢的类型
</td>
<td>
<input type="checkbox" />妩媚的
<input type="checkbox" />妩媚的
<input type="checkbox" />妩媚的
<input type="checkbox" />妩媚的
<input type="checkbox" />妩媚的
</td>
</tr>
<tr>
<td>自我介绍
</td>
<td>
<textarea placeholder="请输入"></textarea>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="image" src="images/btn.png" />
</td>
</tr>
<tr>
<td></td>
<td>
<input type="checkbox" checked="checked" />我同意注册
</td>
</tr>
<tr>
<td></td>
<td>
<h4>我承诺
</h4>
<ul>
<li>年满18岁、单身
</li>
<li>年满18岁、单身
</li>
<li>年满18岁、单身
</li>
</ul>
</td>
</tr>
</table>
</body>
</html>
