学习笔记——html 元素（一）

最新推荐文章于 2024-08-27 11:27:35 发布

痴人说猿梦

最新推荐文章于 2024-08-27 11:27:35 发布

阅读量236

点赞数

分类专栏： 2014夏季学期——web+mySQL

本文链接：https://blog.csdn.net/qq_14882895/article/details/38522513

版权

2014夏季学期——web+mySQL 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

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>