学习笔记——html 元素 (一)

来源:互联网 发布:微信web开发者工具mac 编辑:程序博客网 时间:2024/06/04 01:19

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"><imgsrc="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;"><inputtype="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"><imgsrc="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;"><inputtype="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> 
0 0
原创粉丝点击