2014.8.12
学校的夏季下学期昨天开始的,今天正式开课了,学习的是hmtl元素,这次学习的目标是了解使用PHP,昨晚搭建PHP环境折腾了一晚上,太坑爹了,结果还是不行,过几天换了系统再试试,成功了一定要专门写篇博客纪念一下,废话不说了,直接入主题。
今天主要学的是<table>标签,完成注册页面的代码:
代码如下:
<!DOCTYPE html PUBLIC "-//W3C//Dth XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/Dth/xhtml1-transitional.dth"> | |
<html xmlns="http://www.w3.org/1999/xhtml"> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
<title>User registration</title> | |
</head> | |
<body> | |
<h3 align="center"> 用户注册 </h3> | |
<form method="post" action=""> | |
<table align="center" border="0" width="450px" height="600px"> | |
<tr> | |
<th align="left">账号信息:</th> | |
</tr> | |
<tr> | |
<th> <table align="center" border="0"> | |
<tr> | |
<th width="100px">您的账号:</th> | |
<th align="left"><input type="text" name="userNum" /></th> | |
</tr> | |
<tr> | |
<th>您的密码:</th> | |
<th align="left"><input type="password" name="pwd1"/></th> | |
</tr> | |
<tr> | |
<th>重新输入:</th> | |
<th align="left"><input type="password" name="pwd2"/></th> | |
</tr> | |
<tr> | |
<th>您的姓名:</th> | |
<th align="left"><input type="text" name="userName" /></th> | |
</tr> | |
<tr> | |
<th rowspan="5">您的照片:</th> | |
<th align="left" rowspan="4"><img src="E:\2014小学期\任务\Task01:使用table布局注册表单\Task01:使用table布局注册表单\images\tu_mr.jpg"></th> | |
</tr> | |
<tr> </tr> | |
<tr> </tr> | |
<tr> </tr> | |
<tr> | |
<th rowspan="3"> <style> | |
input{border:1px solid #000;} | |
.clear{clear:both;} | |
.ehdel_upload_show input{background-color:#CCC; float:left; margin-top:10px;} | |
.ehdel_upload{float:left;margin-top:-20px; *margin-top:-40px; filter:alpha(opacity=0);-moz-opacity:0;opacity:0;} | |
</style> | |
<form method="post" action="" enctype="multipart/form-data"> | |
<div class="ehdel_upload_show"> | |
<input id="ehdel_upload_text" type="text" name="txt" /> | |
<input id="ehdel_upload_btn" type="button" value=" 浏览..." /> | |
</div> | |
<div class="clear"></div> | |
<input type="file" onchange="ehdel_upload_text.value=this.value" class="ehdel_upload" /> | |
</form> | |
</th> | |
</tr> | |
</table> | |
</th> | |
</tr> | |
<tr> | |
<th align="left">信息安全:</th> | |
</tr> | |
<tr> | |
<th> <table align="center" border="0"> | |
<tr> | |
<th>是否启用:</th> | |
<th><form> | |
<input name="Yes" type="radio" value="yes" checked="checked" /> | |
是 | |
<form> | |
<input type="radio" name="No" value="no" /> | |
否 | |
</form></th> | |
</tr> | |
<tr> | |
<th>安全问题:</th> | |
<th colspan="2"><select name="biradd" > | |
<option value="">请选择... </option> | |
<option value="questions1">1.XXXXX</option> | |
<option value="questions2">2.xxxxx</option> | |
<option value="questions3">3.XXXX</option> | |
</select> | |
<br/> | |
</th> | |
</tr> | |
<tr> | |
<th >问题答案:</th> | |
<th style=" margin-left:30px;"><input type="text" name="answer"/></th> | |
</tr> | |
<tr> | |
<th ></th> | |
<th height="45px"><input type="submit" value=" 立即注册 " > | |
<input type="reset" value=" 重新填写 " ></th> | |
<th><a href="#">QQ登录</a></th> | |
</tr> | |
</table> | |
</th> | |
</tr> | |
</table> | |
</form> | |
</body> | |
</html> | |
因为要求用<table>标签,所以代码上有些冗余了。
第一次写博客,有些不知所措,不过就像我第一次用C写 hello world 一样有一种开启新事物的兴奋劲,加油,成长中的程序猿!
<!DOCTYPE html PUBLIC "-//W3C//Dth XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/Dth/xhtml1-transitional.dth"> | |
<html xmlns="http://www.w3.org/1999/xhtml"> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
<title>User registration</title> | |
</head> | |
<body> | |
<h3 align="center"> 用户注册 </h3> | |
<form method="post" action=""> | |
<table align="center" border="0" width="450px" height="600px"> | |
<tr> | |
<th align="left">账号信息:</th> | |
</tr> | |
<tr> | |
<th> <table align="center" border="0"> | |
<tr> | |
<th width="100px">您的账号:</th> | |
<th align="left"><input type="text" name="userNum" /></th> | |
</tr> | |
<tr> | |
<th>您的密码:</th> | |
<th align="left"><input type="password" name="pwd1"/></th> | |
</tr> | |
<tr> | |
<th>重新输入:</th> | |
<th align="left"><input type="password" name="pwd2"/></th> | |
</tr> | |
<tr> | |
<th>您的姓名:</th> | |
<th align="left"><input type="text" name="userName" /></th> | |
</tr> | |
<tr> | |
<th rowspan="5">您的照片:</th> | |
<th align="left" rowspan="4"><img src="E:\2014小学期\任务\Task01:使用table布局注册表单\Task01:使用table布局注册表单\images\tu_mr.jpg"></th> | |
</tr> | |
<tr> </tr> | |
<tr> </tr> | |
<tr> </tr> | |
<tr> | |
<th rowspan="3"> <style> | |
input{border:1px solid #000;} | |
.clear{clear:both;} | |
.ehdel_upload_show input{background-color:#CCC; float:left; margin-top:10px;} | |
.ehdel_upload{float:left;margin-top:-20px; *margin-top:-40px; filter:alpha(opacity=0);-moz-opacity:0;opacity:0;} | |
</style> | |
<form method="post" action="" enctype="multipart/form-data"> | |
<div class="ehdel_upload_show"> | |
<input id="ehdel_upload_text" type="text" name="txt" /> | |
<input id="ehdel_upload_btn" type="button" value=" 浏览..." /> | |
</div> | |
<div class="clear"></div> | |
<input type="file" onchange="ehdel_upload_text.value=this.value" class="ehdel_upload" /> | |
</form> | |
</th> | |
</tr> | |
</table> | |
</th> | |
</tr> | |
<tr> | |
<th align="left">信息安全:</th> | |
</tr> | |
<tr> | |
<th> <table align="center" border="0"> | |
<tr> | |
<th>是否启用:</th> | |
<th><form> | |
<input name="Yes" type="radio" value="yes" checked="checked" /> | |
是 | |
<form> | |
<input type="radio" name="No" value="no" /> | |
否 | |
</form></th> | |
</tr> | |
<tr> | |
<th>安全问题:</th> | |
<th colspan="2"><select name="biradd" > | |
<option value="">请选择... </option> | |
<option value="questions1">1.XXXXX</option> | |
<option value="questions2">2.xxxxx</option> | |
<option value="questions3">3.XXXX</option> | |
</select> | |
<br/> | |
</th> | |
</tr> | |
<tr> | |
<th >问题答案:</th> | |
<th style=" margin-left:30px;"><input type="text" name="answer"/></th> | |
</tr> | |
<tr> | |
<th ></th> | |
<th height="45px"><input type="submit" value=" 立即注册 " > | |
<input type="reset" value=" 重新填写 " ></th> | |
<th><a href="#">QQ登录</a></th> | |
</tr> | |
</table> | |
</th> | |
</tr> | |
</table> | |
</form> | |
</body> | |
</html> | |