常用表单书写

最新推荐文章于 2024-10-18 23:53:04 发布

原创最新推荐文章于 2024-10-18 23:53:04 发布 · 617 阅读

0 ·

CC 4.0 BY-SA版权

web前端专栏收录该内容

6 篇文章

订阅专栏

本文详细探讨了在网页和应用程序中创建高效、用户友好的表单设计的关键原则和技巧，包括字段布局、验证提示、错误处理以及提交按钮的最佳实践。通过实例分析，帮助开发者提升用户体验，提高表单填写完成率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>常用表单书写</title>
	</head>
	<body>
		<form action="#" method="post">
		<table>
			<tr>
				<td>用户名</td>
				<td><input name="username" placeholder="请输入用户名"/></td>
			</tr>
			<tr>
				<td>密码</td>
				<td><input type="password" name="password" placeholder="请输入密码"/></td>
			</tr>
			<tr>
				<td>确认密码</td>
				<td><input type="password" name="password" placeholder="请确认密码"/></td>
			</tr>
			<tr>
				<td>Email</td>
				<td><input type="email" name="email" placeholder="Email" /><br /></td>
			</tr>
			<tr>
				<td>姓名</td>
				<td><input type="text" name="name"placeholder="请输入姓名" /><br /></td>
			</tr>
			<tr>
				<td>性别</td>
				<td><input type="radio" value="男" name="gender" />男
			   <input  type="radio" value="女" name="gender" />女<br /></td>
			</tr>
			<tr>
				<td>出生日期</td>
				<td><input type="date" name="birth" placeholder="年/月/日" /><br /></td>
			</tr>
			<tr>
				<td>验证码</td>
				<td><input type="text"  /></td>
			</tr>
			<tr>
				<td></td>
				<td><input style="background: red;" type="button" value="提交" /></td>
			</tr>
		</table>
		</form>
	</body>
</html>