input 属性及值,input全部属性及值,属性、值,全部属性,form表单
示例
1.accept属性—可指定文件类型
<form action="index.html" method="post" id="f1">
<p>
accept属性<input type="file" accept="image/gif,image/jpeg"/>
</p>
</form>
2.align属性—它规定图像的对齐方式
<form action="index.html" method="post" id="f1">
<p>
align属性<input type="image" src="img/未标题-1-恢复的.jpg" align="left" width="50px"/>
</p>
</form>
3.alt属性—当图片不幸丢失后显示的文字
<form action="index.html" method="post" id="f1">
<p>
alt属性<input type="image" src="img/未-恢复的.jpg" alt="Submit"/>
</p>
</form>
4.autocomplete属性—是否让浏览器自动记录之前输入的值
<form action="index.html" method="post" id="f1">
<p>
autocomplete属性<input type="email" autocomplete="off" />
</p>
</form>
5.autofocus属性—在页面加载时获取焦点
<form action="index.html" method="post" id="f1">
<p>
autofocus属性<input type="datetime" autofocus="autofocus" />
</p>
</form>
6.checkbox属性—在页面加载时应该被预先被选中的单选框或复选框
<form action="index.html" method="post" id="f1">
<p>
checkbox属性<input type="checkbox" />a <input type="checkbox" checked="checked" />b <input type="checkbox" />c
<input type="checkbox" checked="checked" />d <input type="radio" name="a" id="a" value="男" checked="checked" />男
<input type="radio" name="a" id="a" value="女" checked="checked" />女
</p>
</form>
7.disabled属性—禁用该input元素
<form action="index.html" method="post" id="f1">
<p>
disabled属性<input type="text" disabled="disabled" />
</p>
</form>
8.form属性—规定该元素所属哪个表单
<form action="index.html" method="post" id="f1">
<p>
form属性<input type="text" form="f1" />
</p>
</form>
9.formaction属性—覆盖form元素的action属性
<form action="index.html" method="post" id="f1">
<p>
formaction属性<input type="submit" formaction="demo_admin.asp" value="formaction属性" />
</p>
</form>
10.formenctype属性—覆盖form元素的enctype属性
<form action="index.html" method="post" id="f1">
<p>
formenctype属性<input type="submit" formenctype="multipart/form-data" value="Submit" />
</p>
</form>
11.formmethod属性—覆盖form元素的method属性
<form action="index.html" method="post" id="f1">
<p>
formmethod属性<input type="submit" formmethod="post" formaction="demo_post.asp" value="Submit" />
</p>
</form>
12.formnovalidate属性—覆盖form元素的novalidate属性
<form action="index.html" method="post" id="f1">
<p>
formnovalidate属性<input type="submit" formnovalidate="formnovalidate" value="Submit" />
</p>
</form>
13.formtarget属性—覆盖form元素的target属性
<form action="index.html" method="post" id="f1">
<p>
formtarget属性<input type="submit" formtarget="_blank" value="Submit" />
</p>
</form>
14.height属性—规定图片的高度
<form action="index.html" method="post" id="f1">
<p>
height属性<input type="image" src="img/未标题-1-恢复的.jpg" alt="Submit" height="128"/>
</p>
</form>
15.list属性—引用数据列表包含输入字段的预定义选项
<form action="index.html" method="post" id="f1">
<p>
list属性
<input type="text" list="url_list" />
<datalist id="url_list">
<option label="W3Schools" value="http://www.w3schools.com" />
<option label="Google" value="http://www.google.com" />
<option label="Microsoft" value="http://www.microsoft.com" />
</datalist>
</p>
</form>
16.max属性—规定输入字段所允许的最大值
<form action="index.html" method="post" id="f1">
<p>
max属性<input type="date" max="2019-01-01" />
</p>
</form>
17.maxlength属性—规定输入字段的最大长度
<form action="index.html" method="post" id="f1">
<p>
maxlength属性<input type="text" maxlength="10" />
</p>
</form>
18.min属性—规定输入字段所允许的最小值
<form action="index.html" method="post" id="f1">
<p>
min属性<input type="number" min="10"/>
</p>
</form>
19.multiple属性—可选择多个文件类型
<form action="index.html" method="post" id="f1">
<p>
multiple属性<input type="file" multiple="multiple" />
</p>
</form>
20.name属性—规定input元素的名称
<form action="index.html" method="post" id="f1">
<p>
name属性 <input type="text" name="email" />
</p>
</form>
21.pattern属性—规定用于验证输入字段的模式(正则)
<form action="index.html" method="post" id="f1">
<p>
pattern属性<input type="text" name="country_code" pattern="[A-z]{3}" />
</p>
</form>
22.title属性—当鼠标悬浮到该元素上时显示的信息
<form action="index.html" method="post" id="f1">
<p>
title属性<input type="text" title="提示" />
</p>
</form>
23.placeholder属性—该元素在未输入内容前的提示
<form action="index.html" method="post" id="f1">
<p>
placeholder属性<input type="text" placeholder="请输入姓名" />
</p>
</form>
24.readonly属性—规定该元素为只读
<form action="index.html" method="post" id="f1">
<p>
readonly属性<input type="text" value="0000000" readonly="readonly" />
</p>
</form>
25.required属性—规定该元素是必填(必选)的
<form action="index.html" method="post" id="f1">
<p>
required属性<input type="text" required="required" />
</p>
</form>
26.size 属性—该元素的可见输入宽度
<form action="index.html" method="post" id="f1">
<p>
size属性<input type="text" size="35" />
</p>
</form>
27.src属性—规定提交按钮显示的图像的URL
<form action="index.html" method="post" id="f1">
<p>
src属性 <input type="image" src="submit.jpg" />
</p>
</form>
28.step属性—只能填step值的整倍数
<form action="index.html" method="post" id="f1">
<p>
step属性<input type="number" step="3" />
</p>
</form>
29.value属性—该元素的初始值
<form action="index.html" method="post" id="f1">
<p>
value属性<input type="text" value="Bush" />
</p>
</form>
30.width属性—规定图片的宽度
<form action="index.html" method="post" id="f1">
<p>
width属性<input type="image" src="img/未标题-1-恢复的.jpg" width="50%"/>
</p>
</form>
31.type属性—全部值
顺序 | 属性值 | 用途 |
---|
1 | button | 按钮 |
2 | checkbox | 复选框 |
3 | color | 颜色选择器 |
4 | date | (日历)包括年、月、日,不包括时间 |
5 | datetime-local | date 和 time 控件(包括年、月、日、时、分,不带时区) |
6 | email | 用于 e-mail 地址的字段 |
7 | file | 文件选择字段和 “浏览…” 按钮,供文件上传 |
8 | hidden | 隐藏输入字段 |
9 | image | 图像作为提交按钮 |
10 | month | 年和月控件(不带时区) |
11 | number | 用于输入数字的字段 |
12 | password | 密码字段 |
13 | radio | 单选按钮。(name必须一样) |
14 | range | 精确值不重要的输入数字的控件(拖动条) |
15 | reset | 重置所有的表单值为初始值 |
16 | search | 输入搜索字符串的文本字段 |
17 | submit | 提交按钮 |
18 | tel | 用于输入电话号码的字段 |
19 | text | 定义一个单行的文本字段(默认) |
20 | time | 用于输入时间的控件(不带时区) |
21 | url | 用于输入 URL 的字段 |
22 | week | 年和周控件(不带时区) |
<form action="index.html" method="post" id="f1">
<p>
1.定义按钮<input type="button" /><br />
2.定义复选框<input type="checkbox" /><br />
3.定义颜色选择器<input type="color" /><br />
4.定义(日历)包括年、月、日,不包括时间<input type="date" /><br />
5.定义 date 和 time 控件(包括年、月、日、时、分,不带时区)<input type="datetime-local" /><br />
6.定义(日历)用于 e-mail 地址的字段<input type="email" /><br />
7.定义文件选择字段和 "浏览..." 按钮,供文件上传<input type="file" /><br />
8.定义隐藏输入字段<input type="hidden" /><br />
9.定义图像作为提交按钮<input type="image" /><br />
10.定义年和月控件(不带时区)<input type="month" /><br />
11.定义用于输入数字的字段<input type="number" /><br />
12.定义密码字段(字段中的字符会被遮蔽)<input type="password" /><br />
13.定义单选按钮。(name必须一样)<input type="radio" /><br />
14.定义用于精确值不重要的输入数字的控件(拖动条)<input type="range" /><br />
15.定义重置按钮(重置所有的表单值为初始值)<input type="reset" /><br />
16.定义用于输入搜索字符串的文本字段<input type="search" /><br />
17.定义提交按钮<input type="submit" /><br />
18.定义用于输入电话号码的字段<input type="tel" /><br />
19.默认。定义一个单行的文本字段<input type="text" /><br />
20.定义用于输入时间的控件(不带时区)<input type="time" /><br />
21.定义用于输入 URL 的字段<input type="url" /><br />
22.定义年和周控件(不带时区)<input type="week" />
</p>
</form>