本课我们学习表单的单行文本框控件：文本框和密码框。
文本框和密码框在互联网世界中随处可见。 例如QQ登录页面、微信小程序的访客预约界面、12306抢票系统的注册页面、填写流量信息的页面等都使用了文本框或密码框。
文本框是一个允许用户输入文本的控制区域。 在此区域输入内容时，文本不会以折线方式显示，而只会垂直排列。 如果输入的文字超过了输入框的默认长度，可以通过键盘拖放或者按该键的右方向键查看所有输入信息。
如何用HTML实现这个单行文本框？
我们可以通过在表单标签中嵌入输入标签来做到这一点。 输入就是输入的意思。
它是一个标签：语法是：喇叭输入。 光有这个标签是不够的，我们需要为它定义一个重要的属性类型html文本输入框，这就是输入控件的类型。
单行文本框的类型值为text，即文本。 事实上，这也是type属性的默认值。
密码框的type值为passwordhtml文本输入框，即密码的意思。 密码输入框也是单行文本输入框，但是当用户输入时，内容被屏蔽，只显示小黑点或者小星号，这样可以防止别人偷看你的密码。
通过文本框和密码框两个控件的定义，我们可以得出一个小结论：表单中的input输入控件，数据采集的方式是由type属性的值决定的。
让我们模拟一个简单的登录框。 用户名是普通的文本输入框，密码是密码输入框。
打开编辑器，新建一个input_text_password.html文件，自动完成基本代码，在body标签内部编译一个form表单标签，在form标签中添加文本，请输入用户名：（用冒号读取），然后然后添加一个输入标签。 节省。
用浏览器打开页面，一个单行文本输入框已经准备好了，可以输入一些内容进行测试。
你可能会问，不定义type属性怎么会有输入框呢？ 我们刚才说了：输入控件的type属性默认值是单行普通文本框。
返回编辑器，定义输入标记的类型属性，并将值设置为文本。 节省。
返回浏览器，刷新，效果和昨天一样。
返回编辑器，在输入框末尾添加 br 标签。 回车和换行。 然后输入文字，请输入密码：，然后添加一个input标签，type属性的值为password。 节省。
回到浏览器，刷新，输入一些内容，效果就实现了。
表单中最常用的两个控件，输入框和密码框讲解完毕，快来一起尝试一下吧！
发表评论