一,常见标签:
1.thead 用于定义表格头部
2.tdody 用于表格的主体
3.tr 行列表
4.td 行内元素(列)
5.tfoot 用于定义表格底部
6.th 头部加粗
二 边框的属性:
1.border 边框 height,width(可以设置高和宽的大小),对齐方式align
2.bgcolor 背景颜色
3.background 背景图片
4.cellpadding 表格边距
5.cellspacing 表格间距
3.单元格
1.colspan 水平方向合并的是列
2.rowspan 垂直方向合并的是行
4.普通表格的嵌套:
<table width="xxx" border="1">
<tr>
<td> </td>
<td>
<table width="100" border="1" align="center">
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</td>
</tr>
</table>
五、表格和表单的结合
列子如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户注册</title>
</head>
<body>
<strong>
<table align="center" >
<form action="" method="post">
<tr align="center" bgcolor="#C0C0C0">
<th colspan="2">用户注册</th>
</tr>
<tr bgcolor="#DDDDDD">
<th width="90" align="right">用户名</th>
<td width="170"><input type="text" name="UserName" style="width:100px"></td>
</tr>//style="width:100px"作用:设置文本框的长度大小
<tr bgcolor="#DDDDDD">
<th width="90" align="right">密码</th>
<td width="170"><input type="password" name="UserPassword" style="width:100px" required="UserPassword" ></td>
</tr>
<tr bgcolor="#DDDDDD">
<th width="90" align="right">性别</th>
<td width="170"><input type="radio" value="男" name="gender" checked="">男
<input type="radio" value="女" name="gender">女</td>
</tr>
<tr bgcolor="#DDDDDD">
<th width="90" align="right">爱好</th>
<td width="170"><input type="checkbox" value="写作" name=" like">写作
<input type="checkbox" value="写作" name=" like">听音乐
<input type="checkbox" value="写作" name=" like">体育</td>
</tr>
<tr bgcolor="#DDDDDD">
<th width="90" align="right">省份</th>
<td><select style="width:70px">
<option value="北京省" name="province">北京省</option>
<option value="上海省" name="province">上海省</option>
<option value="陕西省" name="province" selected="">陕西省</option>
<option value="四川省" name="province">四川省</option>
<option value="重庆省" name="province">重庆省</option>
<option value="河北省" name="province">河北省</option>
</select></td>
</tr>
<tr bgcolor="#DDDDDD">
<th width="90" align="right">自我介绍</th>
<td width="170"><textarea name="intro" cols="25" rows="5" >这个家伙什么也没留
下</textarea> </td>
</tr>
<tr align="center" bgcolor="#C0C0C0">
<td colspan="2">
<input type="submit" name="send" value="提交">
<input type="reset" name="reset" value="重置"> </td>
</tr>
</form>
</table>
</strong>
</body>
</html>