表单(HTML)

复制代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>个人信息</title>
	</head>
	<body>
		<h1>个人信息</h1>
		<form>
			<fieldset>
				<legend>基本信息</legend>
				<label for="name">姓&emsp13;名:</label>
				<input type="text" id="name" name="name" required>
				<br><br>
				<label for="gender">性&emsp13;别:</label>
				<input type ="radio" id="gender" name="gender" valude="male" required>
				<label for="gender">男</label>
				<input type ="radio" id="gender" name="gender" valude="female" required>
				<label for="gender">女</label>
				<br /><br />
				<label for="dob">出生日期:</label>
				<input type="date" id="dob" name="dob" required >
				<br /><br />
				<label for="email">邮&emsp;&nbsp;&nbsp;&nbsp;&nbsp;箱:</label>
				<input type="email" id="email" name="email" required>
				<br /><br />
				<label for="phone">电话号码:</label>
				<input type="tel" id="phone" name="phone" requuired>
				<br /><br />
			</fieldset>
			<fieldset>
				<legend>教育背景</legend>
				<label for="school">学校</label>
				<input type="text" id="school" name="school"required>
				<br /><br />
				<label for="degree">学位:</label>
				<select id="degree" name="degree" required>
					<option value="">请选择学位</option>
					<option value="bachelor">学士</option>
					<option value="master">硕士</option>
					<option value="doctorate">博士</option>
				</select>
				<br /><br />
				<label for="major">专业:</label>
				<input type="text" id="major" name="major" required>
				<br /><br />
			</fieldset>
			<fieldset>
				<legend>工作经历</legend>
				<label for="company">公司</label>
				<input  type="text" id="company" name="company" required>
				<br><br />
				<label for="position">职位:</label>
				<input type="text" id="position" name="position" required>
				<br /><br />
				<label for="start_date">开始日期:</label>
				<input type="date" id="start_date" name="start_date" required>
				<br /><br />
				<label for="end">结束日期:</label>
				<input type="date" id="end" name="end" required>
			</fieldset>
			    <input type="submit" value="提交" style="background-color: red;width: 150px;height: 40px;">
		</form>
	</body>
</html>
相关推荐
程序员游老板3 分钟前
基于SpringBoot3_vue3_MybatisPlus_Mysql_Maven的社区养老系统/养老院管理系统
java·spring boot·mysql·毕业设计·软件工程·信息与通信·毕设
福尔摩斯张21 分钟前
C++核心特性精讲:从C语言痛点出发,掌握现代C++编程精髓(超详细)
java·linux·c语言·数据结构·c++·驱动开发·算法
@淡 定37 分钟前
Spring中@Autowired注解的实现原理
java·后端·spring
前端一小卒38 分钟前
一个看似“送分”的需求为何翻车?——前端状态机实战指南
前端·javascript·面试
syt_101342 分钟前
Object.defineProperty和Proxy实现拦截的区别
开发语言·前端·javascript
遝靑1 小时前
Flutter 跨端开发进阶:可复用自定义组件封装与多端适配实战(移动端 + Web + 桌面端)
前端·flutter
时空无限1 小时前
Java Buildpack Reference
java·开发语言
cypking1 小时前
Web前端移动端开发常见问题及解决方案(完整版)
前端
老前端的功夫1 小时前
Vue 3 vs Vue 2 深度解析:从架构革新到开发体验全面升级
前端·vue.js·架构
栀秋6661 小时前
深入浅出链表操作:从Dummy节点到快慢指针的实战精要
前端·javascript·算法