<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>表单</title>
<!-- 表单的主要目的就是为了收集用户信息，在我们的网页中，我们也需要和用户进行交互，收集用户资料，这时候需要表单。在html当中通常由表单控件，提示信息和表单域三个部分构成 -->
</head>
<body>
<form action="">
<!-- input控件：<input/> 标签是一个单标签，type是最基本的一个属性-->
<table width="600" border="0" cellpadding="0" cellspacing="0" align="center">
<caption><h4>青春不常在，抓紧谈恋爱</h4></caption>
<tr>
<td>性别</td>
<td>
<!-- 给两个input标签的name属性设置一个相同的值，就可以实现单选 -->
<!-- checked="checked"设置默认选择项 -->
男<input type="radio" name="sex" checked="checked"/>
女<input type="radio" name="sex"/>
</td>
</tr>
<tr>
<td>生日</td>
<td>
<!-- select:下拉菜单 -->
<select name="" id="">
<!-- option：选择项 -->
<option value="">请选择年</option>
<option value="">2018</option>
<option value="">2017</option>
<option value="">2016</option>
</select>
<!-- select:下拉菜单 -->
<select name="" id="">
<!-- option：选择项 -->
<option value="">请选择月</option>
<option value="">9</option>
<option value="">10</option>
<option value="">11</option>
</select>
<!-- select:下拉菜单 -->
<select name="" id="">
<!-- option：选择项 -->
<option value="">请选择日</option>
<option value="">6</option>
<option value="">16</option>
<option value="">26</option>
</select>
</td>
</tr>
<tr>
<td>所在地区</td>
<td>
<input type="text" value="北京">
</td>
</tr>
<tr>
<td>婚姻状况</td>
<td>
未婚<input type="radio" name="status" checked="checked"/>
离婚<input type="radio" name="status"/>
丧偶<input type="radio" name="status"/>
</td>
</tr>
<tr>
<td>学历</td>
<td>
<input type="text" value="小学">
</td>
</tr>
<tr>
<td>月薪</td>
<td>
<input type="text" value="5000-10000">
</td>
</tr>
<tr>
<td>手机号</td>
<td>
<input type="text" maxlength="11">
</td>
</tr>
<tr>
<td>密码</td>
<td>
<input type="password" maxlength="8">
</td>
</tr>
<tr>
<td>昵称</td>
<td>
<input type="text" size="20">
</td>
</tr>
<tr>
<td>上传图片</td>
<td>
<input type="file" value="上传图像">
</td>
</tr>
<tr>
<td>喜欢的类型</td>
<td>
妩媚<input type="checkbox">
柔美<input type="checkbox">
可爱<input type="checkbox">
小鲜肉<input type="checkbox">
型男<input type="checkbox">
气质<input type="checkbox">
</td>
</tr>
<tr>
<td>自我介绍</td>
<td>
<!-- 文本域 ：cos：设置可以写多少列。rows：设置可以写多少行-->
<textarea cols="30" rows="10">
</textarea>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="image" src="../素材/btn.png">
</td>
</tr>
<tr>
<td></td>
<td>
<input type="checkbox" >我同意注册条款和会员加入标准
</td>
</tr>
<tr>
<td></td>
<td>
<a href="#">我是会员，立即登录</a>
</td>
</tr>
</table>
</form>
</body>
</html>
网友评论