页面效果
填写简历信息
代码实现
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- table：表示整个表格 -->
<table>
<!-- thead：表格的头部区域 -->
<thead><h3>请填写简历信息</h3></thead>
<!-- tr：表格的一行 -->
<tr>
<!-- td：一个单元格 -->
<td>
<!-- label：点击label也能选中对应的单选，for属性：指定当前label和哪个相同id的input标签对应 -->
<label for="name">姓名</label>
</td>
<td><input type="text"name=""id="name"></td>
</tr>
<tr>
<td>性别</td>
<td>
<!-- 单选框radio；复选框checkbox；checked设置默认值；name相同时只能选一个 -->
<input type="radio"name="sex"id="male"checked="checked">
<label for="male">
<img src="https://img95.699pic.com/xsj/05/2y/9a.jpg!/fw/700/watermark/url/L3hzai93YXRlcl9kZXRhaWwyLnBuZw/align/southeast" alt=""width="20"height="20">男
</label>
<input type="radio"name="sex"id="female">
<label for="female">
<img src="https://pic.616pic.com/ys_bnew_img/00/06/90/6YlqFNky01.jpg" alt=""width="20"height="20">女
</label>
</td>
</tr>
<tr>
<td>出生日期</td>
<td>
<!-- select下拉菜单；selected="selected"表示默认选中；option提供选项 -->
<select name="" id="">
<option value="">--请选择年份--</option>
<option value="">2000</option>
<option value="">2001</option>
<option value="">2002</option>
<option value="">2003</option>
<option value="">2004</option>
<option value="">2005</option>
<option value="">2006</option>
</select>
<select name="" id="">
<option value="">--请选择月份--</option>
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
<option value="">4</option>
<option value="">5</option>
<option value="">6</option>
<option value="">7</option>
<option value="">8</option>
<option value="">9</option>
<option value="">10</option>
<option value="">11</option>
<option value="">12</option>
</select>
<select name="" id="">
<option value="">--请选择日期--</option>
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
<option value="">4</option>
<option value="">5</option>
<option value="">6</option>
<option value="">7</option>
<option value="">8</option>
<option value="">9</option>
<option value="">10</option>
<option value="">11</option>
<option value="">12</option>
<option value="">13</option>
<option value="">14</option>
<option value="">15</option>
<option value="">16</option>
<option value="">17</option>
<option value="">18</option>
<option value="">19</option>
<option value="">20</option>
<option value="">21</option>
<option value="">22</option>
<option value="">23</option>
<option value="">24</option>
<option value="">25</option>
<option value="">26</option>
<option value="">27</option>
<option value="">28</option>
<option value="">29</option>
<option value="">30</option>
<option value="">31</option>
</select>
</td>
</tr>
<tr>
<td><label for="school">就读学校</label></td>
<td><input type="text" id="school"></td>
</tr>
<tr>
<td>应聘岗位</td>
<td>
<input type="checkbox"name="" id="fe">
<label for="fe">前端开发</label>
<input type="checkbox"name="" id="server">
<label for="server">后端开发</label>
<input type="checkbox"name="" id="test">
<label for="test">测试开发</label>
<input type="checkbox"name="" id="operation">
<label for="operation">运维开发</label>
</td>
</tr>
<tr>
<td>掌握的技能</td>
<!-- textarea：内容框 -->
<td><textarea name="" id=""cols="30"row="10"></textarea></td>
</tr>
<tr>
<td>项目经历</td>
<!-- textarea：内容框 -->
<td><textarea name="" id=""cols="30"row="10"></textarea></td>
</tr>
<tr>
<td></td>
<td>
<input type="checkbox"id="read">
<label for="read">我已仔细阅读公司的招聘要求</label>
</td>
</tr>
<tr>
<td></td>
<td><a href="#">查看我的状态</a></td>
</tr>
<tr>
<td></td>
<td>
<ul>
<li>以上信息真实有效</li>
<li>能够尽早去公司学习</li>
<li>能够接受公司的加班文化</li>
</ul>
</td>
</tr>
</table>
</body>
</html>