<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单标签</title>
</head>
<body>
<!--
表单
form
action 将所有的表单送到这action去
method
get url传输 安全性低 执行效率高 传输大小 < 2KB
post 隐蔽传输 安全性高 执行效率低 传输大小 无穷大(服务器的处理能力)
get: 查询数据
post: 增删改数据
enctype
multipart/form-data 上传文件必须加上去
1KB = 1024B
1MB = 1024KB
1GB = 1024MB
1TB = 1024GB
...
input type
text 文本域
password 密码域
radio 单选按钮 checked 默认勾选
checkbox 复选按钮 checked 默认勾选
email 邮箱按钮
date 日期
number 数字
search 搜索
url 网址
file 文件 如果是要上传文件, form必须加 enctype='multipart/form-data'
hidden 隐藏域
submit 提交
reset 重置
button 自定义按钮
image 图片按钮
select 下拉框 multipart
option 下拉子选项
optgroup 下拉组
label 组名
textarea 多文本域
name
rows 行数
cols 列数
常见属性
placeholder 默认背景字
minlength 最小长度
maxlength 最大长度
autocomplete 自动提示 on开 off关
checked 单/复选 默认选项
selected 下拉默认选项
required 不能为空
autofocus 自动获取焦点
readonly 只读
disabled 禁用
multiple select 多选选项 file 多选文件
-->
<h1> 个人资料 </h1>
<form action='3.php' enctype='multipart/form-data'>
<input name="">
帐户:<input type="text" name="user" placeholder='邮箱/手机' maxlength='11' autocomplete='off'> <br><br>
密码:<input type="password" name="pwd" minlength='6' required> <br><br>
性别:
<label><input type="radio" name="sex" value='m'>男</label>
<label><input type="radio" name="sex" value='w'>女</label>
<label><input type="radio" name="sex" value='ry' checked>人妖</label>
<br><br>
爱好:
<input type="checkbox" name="hobby[]" value='bc' checked>飚车
<input type="checkbox" name="hobby[]" value='bm'>把妹
<input type="checkbox" name="hobby[]" value='cartoon'>动漫
<input type="checkbox" name="hobby[]" value='poem'>内涵段子
<input type="checkbox" name="hobby[]" value='tj'>特交
<input type="checkbox" name="hobby[]" value='film'>看电影
<br>
<br>
籍贯:
<select name='sheng'>
<option value='sh'>上海</option>
<option value='js'>江苏</option>
<option >浙江</option>
<option>广东</option>
<option>北京</option>
<option>四川</option>
</select>
<select name='shi'>
<optgroup label='江苏'>
<option>南京</option>
<option>苏州</option>
<option>无锡</option>
<option selected>常州</option>
<option>连云港</option>
</optgroup>
</select>
<br>
<br>
邮箱: <input type="email" name="email" autofocus>
<br>
<br>
生日: <input type="date" name="birthday">
<!-- 2e3 2*10*10*10 -->
价格: <input type="number" name="price" readonly value='123'>
搜索: <input type="search" name="" disabled value='www.baidu.com'>
网址: <input type="url" name="">
<br>
<br>
头像: <input type="file" name="touxiang" >
<br>
<br>
隐藏域: <input type="hidden" name="" value=''>
<br>
<br>
自我介绍:<textarea name='zwjs' rows=5 cols='40'></textarea>
<br>
<br>
<input type="submit" value='登录'>
<input type="reset" value='重来一边'>
<input type="button" value='自定义按钮'>
<input type="image" src='../dxj.jpg'>
</form>
</body>
</html>
表单上传传输下拉框文本域密码提示限定
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
推荐阅读更多精彩内容
- 方法1:通过js来设置文本框input ·····placeholder的显示文本 document.getEl...
- 1 margin的一点小问题 2 上面的元素的margin-bottom和下面元素的margin-top会重合 3...
- 一、 现象 chrome浏览器表单自动填充后,input文本框的背景会变成黄色的,这是chrome浏览器会给自动填...