<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
form {
width: 615px;
height: 450px;
background: url(images/tx.png) no-repeat center;
}
fieldset {
border: none;
}
fieldset legend {
display: none;
}
#textarea {
width: 16em;
border: solid 1px #aaa;
position: relative;
top: -3px;
}
.checkbox {
border: solid 1px #d8bca9;
position: relative;
top: 3px;
left: -1px;
}
.title {
display: block;
font-weight: bold;
}
.top {
margin-top: 80px;
}
.center {
text-align: center;
}
.red {
color: red;
margin-left: -10px;
padding-right: 2px;
}
.error {
color: white;
background: red;
padding: 2px;
margin: 0 4px;
}
.tip {
color: white;
background: blue;
padding: 2px;
margin: 0 4px;
}
</style>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<fieldset>
<legend>学生信息登记表</legend>
<p class="top">
<label for="textfield" class="title">
<span class="red">*</span>姓名
</label>
<input type="text" name="textfield" id="textfield" />
<span class="error">
请输入真实姓名
</span>
<span class="tip">
请输入汉字
</span>
</p>
<p>
<label for="textarea" class="title">备注</label>
<textarea name="textarea" id="textarea" cols="45" rows="5"></textarea>
</p>
<p>
<span class="title">兴趣</span>
<label for="checkbox">文学</label>
<input type="checkbox" name="checkbox" class="checkbox" id="checkbox" />
<label for="checkbox2">艺术</label>
<input type="checkbox" name="checkbox2" class="checkbox" id="checkbox2" />
<label for="checkbox3">体育</label>
<input type="checkbox" name="checkbox3" class="checkbox" id="checkbox3" />
<label for="checkbox4">其它</label>
<input type="checkbox" name="checkbox4" class="checkbox" id="checkbox4" />
</p>
<p>
<span class="title">性别</span>
女<input type="radio" name="radio" id="radio" value="radio" />
男<input type="radio" name="radio" id="radio" value="radio2" />
</p>
<p>
<label for="select" class="title">专业</label>
<select name="select" id="select">
<option value="1">计算机</option>
<option value="2">法律</option>
<option value="3">英语</option>
<option value="4">工商管理</option>
</select>
</p>
<p class="center">
<input type="submit" name="button" id="button" value="提交" />
<input type="reset" name="button2" id="button2" value="重置" />
</p>
</fieldset>
</form>
</body>
</html>
10-31
4629
11-04
1436