简单的写一个表单
代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<style>
table{
border: 1px solid beige;
}
span{
color: #66CCFF;
}
th{
background-color: gainsboro;
}
tr{
border: 1px solid beige;
}
td{
border: 1px solid aliceblue;
}
.redText{
color: red;
}
.redStar{
color: red;
}
</style>
</head>
<body>
<!-- 8列-->
<form action="">
<table align="center" cellspacing="0">
<tr>
<th colspan="8" align="left">填写信息的表单</th>
</tr>
<tr>
<td>用户名:</td>
<td colspan="2"><input type="text"/><span class="redStar">* </span></td>
</tr>
<tr>
<td>密 码:</td>
<td colspan="2"><input type="password"/><span class="redStar">* </span></td>
</tr>
<tr>
<td>再次输入密码:</td>
<td colspan="2"><input type="password"/><span class="redStar">* </span></td>
<td colspan="5"><span>两次输入的密码必须一致</span></td>
</tr>
<tr>
<td>真实姓名:</td>
<td colspan="2"><input type="text"/><span class="redStar">* </span></td>
</tr>
<tr>
<td>性别:</td>
<td colspan="5"><input type="radio" checked="checked" name="Sex" value="male"/>女<input type="radio" name="Sex" value="female"/>男</td>
</tr>
<tr>
<td>电子邮箱:</td>
<td colspan="2"><input type="text"/><span class="redStar">* </span></td>
</tr>
<tr>
<td>固定电话:</td>
<td colspan="2"><input type="text"/><span class="redStar">* </span></td>
</tr>
<tr>
<td>所在地:</td>
<td colspan="7">
<select>
<option>贵州省</option>
<option>宁夏回族自治区</option>
<option>四川省</option>
</select>
<select>
<option>贵阳市
</option>
<option>清镇市</option>
<option>安顺市</option>
</select>
</td>
</tr>
<tr>
<td>街道地址:</td>
<td colspan="5"><input style="width: 350px;" type="text"/><span class="redStar">* </span></td>
<td colspan="2"><span>填写县(区)、街道、门牌号</span></td>
</tr>
<tr>
<td>传真号码:</td>
<td colspan="7"><input type="text"/></td>
</tr>
<tr>
<td>手机号码:</td>
<td colspan="7"><input type="text"/></td>
</tr>
<tr>
<td>邮政编码:</td>
<td colspan="7"><input type="text"/></td>
</tr>
<tr>
<td></td>
<td colspan="7"><input style="background-color: #00FF00;color: white" type="submit" value="确认提交"/></td>
</tr>
</table>
</form>
</body>
</html>
运行结果: