<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单&表单元素</title>
</head>
<body>
<form action="xxx.jsp" method="post">
<table border="1" align="center" cellspacing="0" width="500px" height="700px">
<tr>
<th colspan="2">常用的表单元素</th>
</tr>
<tr>
<td>文本框：</td>
<td>
<input type="text" name="userName" />
</td>
</tr>
<tr>
<td>密码框：</td>
<td>
<input type="password" name="pwd" />
</td>
</tr>
<tr>
<td>邮箱输入框：</td>
<td>
<input type="email" name="eamil" />
</td>
</tr>
<tr>
<td>数字输入框：</td>
<td>
<input type="number" name="num" />
</td>
</tr>
<tr>
<td>浏览框：</td>
<td>
<input type="file" name="upfile" />
</td>
</tr>
<tr>
<td>单选框：</td>
<td>
<input type="radio" name="sex" />男
<input type="radio" name="sex" />女
<input type="radio" name="sex" />妖
</td>
</tr>
<tr>
<td>复选框：</td>
<td>
<input type="checkbox" name="like[]" />LOL
<input type="checkbox" name="like[]" />DOTA
<input type="checkbox" name="like[]" />DNF
<input type="checkbox" name="like[]" />CSGO
</td>
</tr>
<tr>
<td>下拉框：</td>
<td>
<select name="age" >
<option value ="">请选择</option>
<option value ="">18到25周岁</option>
<option value ="">26到30周岁</option>
<option value ="">30周岁以上</option>
</select>
</td>
</tr>
<tr>
<td>多行文本框/文本域：</td>
<td>
<textarea name="content" rows="10" cols="30" >
</textarea>
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="提交" />
<input type="reset" value="重置">
<input type="button" value="自定义按钮">
<input type="image" src="../day02/lashou/5.jpg" width="100px">
<button type="submit">button标签</button>
</td>
</tr>
</table>
</form>
</body>
</html>
效果图：
个别重要的小知识：
1.内联元素: 不换行
块级元素: 换行，宽度占其父元素（body）宽度的100%
2.表单：收集客户端用户数据信息，发送至服务器与之交互
<form action="提交地址" method="get|post">
3. 文件上传：<input type="file"> 提交方式一定是post
增加一个属性: enctype="multipart/form-data"
get: 不安全(数据会附着在url地址栏)、文本信息 128kb
post :大部分该方式，安全（在请求传递数据）、进制流 理论上无限制
4.属性:
placeholder： 输入提示
maxlength: 最大输入长度
readonly="readonly" 只读
disabled="disabled" 禁用
value: 默认值
multiple="multiple" 浏览框支持多文件选择
checked="checked" 默认选中(单、复选框支持)
selected="selected" 默认选中(下拉框)
required="required" 非空验证
pattern=" " 正则验证（正则表达式）
9520
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
