标签：
table:定义一个表格
tr:定义行
td:定义列
th:定义列标题加粗显示
属性
border 设置表格边框
width，height设置表格宽度，高度
align,valign设置单元格水平或者垂直对齐
bgcolor设置表格颜色
colspan:定义在td中可以合并列
rowspan:定义在td中可以合并行
form常用属性
form标签定义表单
属性
action =“服务器地址”把表单的数据提交到该地址
method：提交方式，get不安全，速度快，不能大于2kb,post安全，大小不限，速度慢
表单元素
type=“元素”
text:单行文本框
password：密码框
radio:单选按钮，要想只能选择一个，name值要设置成相同的
checkbox：复选框
submit：提交按钮
reset：重置按钮
button：普通按钮
image：图片提交按钮
Email：邮箱
number：数值输入
date：日期框
基本应用效果图：
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="" method="post">
<table cellspacing="" cellpadding="" align="center">
<tr>
<td colspan="2">
</td>
<td >
<font size="6" face="黑体">用户注册</font>
</td>
</tr>
<tr>
<td colspan="2" align="right">
用户名
</td>
<td>
<input type="text" name="" id="" value="" />
</td>
</tr>
<tr>
<td colspan="2" align="right">
密码
</td>
<td>
<input type="password" name="" id="" value="" />
</td>
</tr>
<tr>
<td colspan="2" align="right">
确认密码
</td>
<td>
<input type="password" name="" id="" value="" />
</td>
</tr>
<tr>
<td colspan="2" align="right">
性别
</td>
<td>
<input type="radio" name="a" id="a" value="" />男
<input type="radio" name="a" id="a" value="" />女
</td>
</tr>
<tr>
<td colspan="2" align="right">
爱好
</td>
<td>
<input type="checkbox" name="" id="" value="" />学习
<input type="checkbox" name="" id="" value="" />编程
<input type="checkbox" name="" id="" value="" />健身
</td>
</tr>
<tr>
<td colspan="2" align="right">
出生日期
</td>
<td>
<input type="date" name="" id="" value="" />
</td>
</tr>
<tr>
<td colspan="2" align="right">
工资
</td>
<td>
<input type="number" name="" id="" value="" />
</td>
</tr>
<tr>
<td colspan="2" align="right">
学历
</td>
<td>
<select name="">
<option value="">小学</option>
<option value="">大学</option>
</select>
</td>
</tr>
<tr>
<td colspan="2" align="right">
基本信息
</td>
<td>
<textarea name="" rows="3" cols="16"></textarea>
</td>
</tr>
<tr>
<td colspan="2" align="right" >
<input type="submit" name="" id="" value="提交" />
</td>
<td>
<input type="reset" name="" id="" value="重置" />
</td>
</tr>
</table>
</form>
</body>
</html>
基本应用效果图：
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table cellspacing="" cellpadding="">
<tr>
<td colspan="2">
公司名称
<br />
</td>
<td colspan="3" align="right">
加入收藏
</td>
</tr>
<tr>
<td colspan="2"><img src="img/new_logo.png"/></td>
<td colspan="3" align="right">
<img align="right" src="img/nav_r_ico.png"/></td>
</tr>
<tr>
<td colspan="5" align="center">
<hr />
首页 关于
<hr />
</td>
</tr>
<tr>
<td colspan="5" align="right">
java列表
</td>
</tr>
<tr>
<td colspan="5">
<h3>
课程培训
</h3>
<h2>
共种课程视频
</h2>
</td>
</tr>
<tr>
<td colspan="5">
<img width="100%" src="img/001.png"/>
</td>
</tr>
<tr>
<td align="center">
<img src="img/002.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
<td align="center">
<img src="img/003.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
<td align="center">
<img src="img/004.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
<td align="center">
<img src="img/005.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
<td align="center">
<img src="img/006.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
</tr>
<tr>
<td align="center">
<img src="img/007.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
<td align="center">
<img src="img/008.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
<td align="center">
<img src="img/009.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
<td align="center">
<img src="img/010.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
<td align="center">
<img src="img/011.png"/>
<br />
书名：sss
<br />
价格：sss
</td>
</tr>
<tr>
<td colspan="5" >
<img width="100%" src="img/012.png"/>
</td>
</tr>
</table>
</body>
</html>