一、<input>是什么
它在HTML中代表一个元素(Element),多数用于表单的互交控件。
input在HTML中没有闭合标签,单标签的"/"可以不写。
二、<input>属性介绍
type属性
<ol>
<li>type属性有很多的可用值接下来看一下不同的值有什么不同的效果:text
首先type不写值会怎么样?
我们可以看到在type属性没有写类型值得话,默认是文本输入框,也就是"text"
</li>
<li>button
type值为button的话,如同单词一样会出现按钮,但是这个按钮看起来有点变扭(没有文字提示)
只要加上value属性就可以赋值文字了,如图
</li>
<li>checkbox(复选框);radio(单选)
type值为checkbox,这时候input变成了复选框进行勾选,type后面的name属性可以设置复选框的分组,此时性别(gender)为一组。再后面的value赋值多数用于提交信息。比如我选男,提交的信息就知道我选的是man。
添加checked属性可以默认选到该选项,如图可以看到默认为男。
值为radio实现单选,注意设置name属性值一样的为一组,才能实现单选
</li>
<li>color
改变控件的颜色,value值设置颜色,但是图中的red并没有变成红色,再看下一张图
用HEX格式表示才可以。用rgb也是不行的。
</li>
<li>date,datetime-local
date
获取控件年,月,日。不包含时间
datetime-local
获取控件年,月,日,时间
</li>
<li>file
设置选择文件的控件
</li>
<li>password
遮挡输入的密码
</li>
<li>reset
清除当前表单(form)所有内容恢复默认,点击重置后,文本框中‘你好’清除,变成默认值
</li>
<li>submit
提交表单内容
</li>
<li>url
输入URL地址,如果输入非法字符会提示你。
</li>
</ol>
accept属性(配合type="file")
选择文件类型
audio是选择为全部音频类型文件,
video选择全部视频类型文件,
image选择全部图片类型文件,
规定指定类型的文件,值为后缀扩展名,
指定MIME类型<a href="http://www.ruanyifeng.com/blog/2008/06/mime.html"target="_blank" >(MIME详情点击)</a>