input标签(HTML中input用法详解)
input标签
<formaction="form_action.asp"method="get">
Firstname:<inputtype="text"name="fname"/>
Lastname:<inputtype="text"name="lname"/>
<inputtype="submit"value="Submit"/>
</form>
HTML中input用法详解
1、type
格式：type=“文本的类型”
当type设置为text时，text属性表示一个纯文本，可以向其中输入任何类型的文本、数字或字母等。
具体说明：
：假如一个input没有type特点，那么它会是默许type=“text”。没有什么特别的，便是允许输入文本，简单明了。
：望文生义，在用户输入暗码的时候主张运用这个特点而非text，运用了这个特点，用户输入的文字将会变成*，我们是看不到的，当然，传给后台会是用户输入的文本。有些手机端上不会一开始便是*，而是会短暂的明文显现用户输入的最后一个字符，然后才是*。
：一个按钮，表单按钮，和单纯的元素比较，没有运用CSS便利，所以假如你不是想用这个按钮去重置（reset）或许提交（submit），并且为了和传统的表单风格比较配的话，主张你都运用而不是。
：复选框，默许是小方格，能够挑选多个。
：单选框，默许是小圆圈，只能挑选一个。
：通常被认为是一个提交按钮，当点击此按钮时，提交本表单的数据。
：这个类型和其他的不同，其他无非是一些挑选，或许输入文本，而这个特点，是为了能让用户上传本地文件。
：该特点是用来隐藏掉该表单控件。
：该特点接受一切，将会像submit相同提交图片，假如想上传图片，相片，无妨运用这个特点。
：重置按钮，点了这个按钮，表单的数据全部重置，也便是清空的意思。慎用！
以上的都是HTML5以前都有的特点，下面是新增的（跟键盘有关的都是要合作手机端运用才有作用）：
：该特点外观上和文本栏相似，用于指定一个电子邮箱地址。在web端没有什么不同，但是在手机端就不相同了，输入键盘会主动的变成有@数字A-Z.等，与输入邮箱有关的字符，用户体会直线上升，有木有？
：外观功用和相似，用于指定一个web地址。在手机端上会主动转换成有相似于.com\等便利用户输入web地址的键盘。
：用于指定输入的是电话号码。键盘就会变成输入电话号码的键盘。当然，也能够自己界说一些格局什么的，比方023-8208之类的，需求与pattern特点连用。
：用于指定输入的是数字，键盘为输入数字的键盘。
：变成一个滑动条，不同的客户端显现出默许的款式是不相同的。用户能够左右滑动。webkit中能够运用CSS：input[type=range]{=webkit-appearance:slider-vertical}让滑动条竖起来。
：查找栏。假如有文本输入的话，很多浏览器会在最右边显现一个清空查找栏的小叉，点了就清空该查找栏。
：在浏览器支撑的情况下，供给一个拾色器，尽管功用没有PS里边的那么强壮，不过感觉和window自带的图像功用里边的拾色器差不多。
：日期挑选器，能够用来挑选年月日。
：该特点供给两个栏，一个年月日，一个用于时分秒。时区被设置成了UTC。
：和简直彻底相同，仅仅不是UTC时刻。
：只包含了年，月的时刻挑选器。
：该特点是输入多少年的多少周，你能够挑选日期，但是回来的是XXXX年XX周。
：只包含了时分秒的时刻挑选器，并且是24小时制。
2、name
格局：name=“控件的称号”
表明文本框的称号，主要是用来区别其他的控件（相当于起名字）
3、size
格局：size=“控件的长度”
表明文本框在页面里能够显现出来的长度（便是你能看见文本框里边有多少个字符）
4、maxlength
格局：maxlength=“最长的字符数”
表明文本框里边最多能够输入的字符数
5、value
格局：value=“文字域的默许取值”
用于界说文本框中的默许值（便是你什么都不输入的时候就会在文本框里显现的值）
input标签中常见的特点补充说明：
type：该特点是input标签里唯一的有必要输入的特点，当然，也能够不填，默许为type=“text”。
required：标记一个字段是否为有必要。假如一个字段被标记为required=“required”（严厉形式下），或许required（宽松形式下）(ps：下面特点的写法同理，就不一一写出了)，并且这个字段的值为空，或许填入的值是无效值，那么这个表单不能提交。什么是无效值？看pattern特点。
pattern：该特点包含了一个JavaScript风格的正则表达式，输入的内容有必要彻底匹配该正则表达式，不然就算输入的内容无效。对正则表达式不了解？能够去看看JavaScript正则表达式。
minmax：这两个特点用于日期date时刻time等输入，还有number和range。望文生义，它们的作用是约束最大值，最小值。
step：和maxmin相似，作用是供给一个能够上下点的按钮，比方当前数字是1，你设置了step=“5”，点一下上的按钮，就变成6了。（注意：InternetExplorer9及更早IE版本，或Firefox不支撑input标签的step特点。）
placeholder：该特点一般是用来提示用户输入的，当用户真的输入了文字之后，会被输入的文字掩盖。
readonly：该特点会让表单空控件不行修改。这里的不行修改不是禁用，仅仅不能修改文本而已，比方像单选框radio，复选框checkbox这种，原本便是不行修改的，所以这个特点对它们来说毫无意义。
disabled：该特点会禁用一个表单元素。这里是禁用，彻底禁用掉除了之外的一切表单元素。
maxlength：该特点用于约束用户输入的最大字数约束。
size：现已很少人直接这样运用了，操控巨细现在简直都是由CSS操控了。
autocomplete：望文生义，主动完结，用户输入一部分，后边的主动补全。需求浏览器保存用户输入的内容，以便下一次主动补全。
autofocus：该特点指的是表明这个表单控件在页面载入的时候主动取得焦点。
form：在HTML5中，表单控件现已没有必要嵌套在一个表单中，新的form特点能够把表单元素与页面上的恣意的表单相关起来。也能够被嵌套在一个表单中，随着另一个表单提交，代码如下：
这样，就把form和input联系起来了。假如input没有form特点，那么，它将被相关到离他最近的form表单。
作品标签： input
优秀作品：
最新作品：
评论列表（共97人参与）参与讨论或分享设计作品获得视觉癖积分奖励
少钱 lo注册会员
2020-12-28 22:33:59
方向岗位 专业技能包含宣扬页的规划、VI规划、海报规划、版面规划、平面广告/LOGO规划等等 合适工作的职业例如> 3.天冷了，只有外套，没有拥抱。 4.天
回复
爱好者几注册会员
2020-12-28 21:59:43
作为一部动画游客
2020-12-28 5:31:4
游客63287：input标签(HTM术。由于有知识技能的堆叠，平面规划常常被误认为是视觉传达或传达规划。平面规划经过运用多种不同的方法去发明和组合文字、符号和图画去发生视觉思想和信息。平面规划师或许会运用字体编列、版面技术来使产品规划到。这也是咱们之前说过的，学习要有明确的方向和用处。这不是眉毛。 5、资料与照明：资料与照明是不可分割的。原料作用由灯火反射。资
回复
站体系遍注册会员
2020-12-28 15:3:27
name=lname/ i> 我建议新手仍是要先了解模式，流程和规范，等有所积累再去做有用立异，否则仅仅建在沙滩上的楼阁。 还有头像圆形问题，由
回复