HTML 表单格式化

最新推荐文章于 2025-05-02 08:30:58 发布

Ethon自动化测试

最新推荐文章于 2025-05-02 08:30:58 发布

阅读量943

点赞数

分类专栏： Java 文章标签： html

本文链接：https://blog.youkuaiyun.com/zhijun0901/article/details/85648438

版权

Java 专栏收录该内容

19 篇文章

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>用户注册</title>
	</head>
	<body>
		<table border="1px" cellspacing="0px" cellpadding="10px" width="400px" >
			<tr>
				<td>用户名</td>  <!--文本框-->
				<td><input type="text" name="uname" value=""/></td>
			</tr>
			<tr>
				<td>密码</td>   <!--密码框-->
				<td><input type="password" name="pwd" value=""/></td>
			</tr>
			<tr>
				<td>性别</td> <!--单选按钮-->
				<td>   
					<input type="radio" name="sex" value="男" checked="checked"/>
					<input type="radio" name="sex" value="女"/>
				</td>
				
			</tr>
			<tr>
				<td>技术特长</td> <!--多选按钮-->
				<td>
					<input type="checkbox" name="hoddy" value="Java"/>Java
					<input type="checkbox" name="hoddy" value="Orace" />Orace
					<input type="checkbox" name="hoddy" value="C++" />C++
				</td>
			</tr>
			<tr>
				<td>省份</td> <!--下拉列表-->
				<td>
					<select name="">
						<option value="湖北省">湖北省</option>
						<option value="广东省" selected="selected">广东省</option>
						<option value="湖南省">湖南省</option>
						<option value="江西省">江西省</option>
						<option value="福建省">福建省</option>
						<option value="云南省">云南省</option></optgroup>
					</select>
				</td>
			</tr>
			<tr>
				<td>头像</td> 	<!--文件域-->
				<td><input type="file" value="photo"</td>
			</tr>
			
			<!--隐藏域-->
			<input type="hidden" name="id" value="1001"/>
			
			<tr>
				<td>协议</td>
				<td>   <!--多行文本域-->
					<textarea rows="3" cols="15">
						请阅读协议并确认
					</textarea>
					<input type="checkbox"/>同意协议
				</td>
			</tr>
			<tr>
				<td>普通按钮</td>
				<td><input type="button" value="普通按钮"</td>
			</tr>
			<tr>
				<td>提交</td>
				<td><input type="submit" value="注册"</td>
			</tr>
			<tr>
				<td>重置</td>
				<td><input type="reset" value="重置"/></td>
			</tr>		
		</table> <!--图片按钮，自带提交表单功能-->
		<input type="image" align="middle" src="img/goBtn.gif"/>
	</body>
</html>

页面效果：