html的案列1——使用表单标签和表格标签生成页面 

<html>
<head><title>怪兽不纯粹的表单页面测试</title></head>
<body>
<form action = "world.html" method = "poster">　　//设置内容的提交地址和提交方式。
<table border = "0" width = "450" height = "500">//设置表格的宽、高和线的大小。（最后将线大小设置为0，达到隐藏表格的效果，从而呈现最终的页面效果）
<tr>
	<td>注册邮箱:</td>
	<td><input type = "text" name = "email"/></td>
</tr>
<tr>
	<td> </td>
	<td>你还可以使用<a href = "#">账号</a>注册或者<a href = "#">手机号</a>注册</td>
</tr>
<tr>
	<td>创建密码:</td>
	<td><input type = "password" name = "password"/></td>
</tr>
<tr>
	<td>真实姓名:</td>
	<td><input type = "text" name = "realname"/></td>
</tr>
<tr>
	<td>性别:</td>
	<td><input type = "radio" name = "sex" value = "nan"/>男<input type = "radio" name = "sex" value = "nv"/>女</td>　　//radio，单选（name属性相同，value值不同）
</tr>
<tr>
	<td>爱好:</td>
	<td><input type = "checkbox" name = "love" value = "lq"/>篮球　　　　//checkbox，多选（name属性相同，value属性值不同）
		<input type = "checkbox" name = "love" value = "ppq"/>乒乓球
		<input type = "checkbox" name = "love" value = "eating">吃东西
	</td>
</tr>
<tr>
	<td>生日:</td>
	<td>
	<select name = "year">　　　　　　　　　　　　　　　　//下拉列表框，
	<option value = "1998">1998</option>
	<option value = "1999">1999</option>
	<option value = "2000">2000</option>
	</select>年

	<select name = "month">
	<option value = "1">1</option>
	<option value = "2">2</option>
	<option value = "3">3</option>
	</select>月

	<select>
	<option value = "20">20</option>
	<option value = "21">21</option>
	<option value = "22">22<option>
	</select>日
	</td>
</tr>
<tr>
	<td>我现在:</td>
	<td>
	<select name = "now">
	<option value = "school">我现在正在上学</option>
	<option value = "work">我现在正在工作</option>
	<option value = "play">我现在正在玩耍</option>
	</select>
	</td>
</tr>
<tr>
	<td> </td>
	<td><image src = "TX.jpg" width = "50" height = "50"/> <a href = "#">看不清换一张？</a></td> //此处既可以使用按钮提交内容，也可以使用图片提交内容
</tr>
<tr>
	<td>验证码注册:</td>
	<td><input type = "text" name = "zc"/></td>
</tr>
<tr>
<td> </td>
<td><input type = "submit" name = "get" value = "立即注册成为好友"/></td>
</tr>
</table>

</form>
</body>
</html>

 效果：

知识点回忆：

1、使用表格标签进行内容排版，同时方便设置内容的对齐方式（align）。

2、使用表单标签设置每一个内容格式（不同的输入项，单选，多选，下拉列表框，按钮，内容提交等）

3、其他html常用标签的使用（超链接、图片导入等）

posted @ 2018-11-25 14:10  怪兽不纯粹  阅读(122)  评论(0)    收藏  举报