制作注册页面--Day10
制作注册页面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>制作注册页面</title>
<style type="text/css">
body{ font-size:12px; font-family:"宋体" ; color:#515151;}
body,h2,form,table,{ margin:0; padding:0;}
.box{ width:660px; height:600px; border:1px solid #ccc; padding:20px; margin:50px auto 0;}
.header{ font-size:22px; color:#0b0b0b; padding-bottom:30px;}
.header span{ font-size:12px; font-weight:normal;}
td{ padding-bottom:26px;}
td.left{ width:78px; text-align:right; padding-right:8px; }
.red{ color:#f00;}
.text01, .text02{ width:264px; height:12px; border:1px solid #ccc; padding:3px 3px 3px 25px; font-size:12px; color:#949494;}
.text01{ background: url(image/transfer04.jpg) no-repeat 2px center;}
.text02{ background: url(image/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20210110185040.png) no-repeat 2px center;}
.text03{ width:122px; height:12px; padding:3px 3px 3px 26px; font-size:12px; background:url(image/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20210110185110.png) no-repeat 2px center;}
.course{ width:180px;}
.message{ width:430px; height:160px; font-size:12px; color:#F36; padding:6px; }
</style>
</head>
<body>
<div class="box">
<h2 class="header">下面开始在线报名吧<span>(以下信息是报名传智播客的重要证据，请认真填写)</span></h2>
<form action="#" method="post">
<table class="content">
<tr>
<td class="left">姓名<span class="red">*</span></td>
<td><input type="text" value="报名的重要依据，请认真填写" class="text01" /></td>
</tr>
<tr>
<td class="left">电话<span class="red">*</span></td>
<td><input type="text" value="报名的重要依据，请认真填写" class="text02" /></td>
</tr>
<tr>
<td class="left">性别<span class="red">*</span></td>
<td>
<label for="boy"><input type="radio" name="sex" id="boy" />男</label>
<label for="girl"><input type="radio" name="sex" id="girl" />女</label>
</td>
</tr>
<tr>
<td class="left">邮箱<span class="red">*</span></td>
<td><input type="text" class="text03" /></td>
</tr>
<tr>
<td class="left">意向课程<span class="red">*</span></td>
<td>
<select class="course">
<option>网页设计基础班</option>
<option selected="selected">网页设计就业班</option>
<option>网页设计UI周末班</option>
</select>
</td>
</tr>
<tr>
<td class="left">了解传智播客</td>
<td>
<label for="baidu"><input type="checkbox" id="baidu" />baidu</label>
<label for="itcase"><input type="checkbox" id="itcase" />传智老学员</label>
<label for="friend"><input type="checkbox" id="friend" />朋友推荐</label>
<label for="csdn"><input type="checkbox" id="csdn" />csdn网站</label>
<label for="video"><input type="checkbox" id="video" />视频教程</label>
<label for="other"><input type="checkbox" id="other" />其他</label>
</td>
</tr>
<tr>
<td class="left">留言</td>
<td><textarea cols="50" rows="5" class="message">请简述您有没有设计基础，以及为什么选择学习网页平面UI设计?</textarea></td>
</tr>
<tr>
<td> </td>
<td><input type="submit" value="提交" /></td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>
浙公网安备 33010602011771号