HTML密码框
网页中最典型的应用密码框的场景就是网站的登录注册页面。例如 新宝库的登录(http://vip.xinbaoku.com/login.php)或者注册(http://vip.xinbaoku.com/register.php)页面中的密码字段使用的就是密码框。
在 HTML 中,把 <input> 标签的 type 属性设置为 password 可以表示密码框。具体语法格式如下:
图1:密码框
从运行结果来看,密码框在外观上和单行文本框相同,但是两者之间是有区别的:
图2:键入了默认密码的密码框
通过运行结果可以发现,默认的密码"123456"被
在 HTML 中,把 <input> 标签的 type 属性设置为 password 可以表示密码框。具体语法格式如下:
<input type="password" />
接下来我们看一个具体的例子:<form action="http://vip.xinbaoku.com/login.php" method="post" name="myForm"> 密码:<input type="password" name="psd"> </form>运行效果如图所示:
图1:密码框
从运行结果来看,密码框在外观上和单行文本框相同,但是两者之间是有区别的:
- 单行文本框输入的字符可见;
-
密码框输入的字符不可见,会被
▪
代替。请读者自己试一试。
注意:密码框设置输入字符被▪
代替的原因,只是防止用户周围的人看到密码,后台是可以拿到输入的内容的。
1) maxlength属性
maxlength 属性表示密码框最多可以输入的字符数量。如果我们需要设置用户输入的密码不得超过 6 位,可以这样写:<form action="http://vip.xinbaoku.com/login.php" method="post" name="myForm"> 密码:<input type="password" name="psd" maxlength="6"> </form>进行设置后,当用户输入的密码大于 6 位,不再允许输入。
2) value属性
value 属性用来表示密码框的默认值,一般密码都是由用户自行输入的,但是有的情况我们需要给用户一个默认密码,就可以这样写:<form action="http://vip.xinbaoku.com/login.php" method="post" name="myForm"> 密码:<input type="password" name="psd" value="123456"> </form>运行效果如图所示:
图2:键入了默认密码的密码框
通过运行结果可以发现,默认的密码"123456"被
▪
代替。3) size属性
同单行文本框中的 size 属性相同,也表示文本框可见的字符数。注意:一般我们只需设置 maxlength 来限制用户输入的密码不大于多少位,不使用 size 属性。
所有教程
- C语言入门
- C语言编译器
- C语言项目案例
- 数据结构
- C++
- STL
- C++11
- socket
- GCC
- GDB
- Makefile
- OpenCV
- Qt教程
- Unity 3D
- UE4
- 游戏引擎
- Python
- Python并发编程
- TensorFlow
- Django
- NumPy
- Linux
- Shell
- Java教程
- 设计模式
- Java Swing
- Servlet
- JSP教程
- Struts2
- Maven
- Spring
- Spring MVC
- Spring Boot
- Spring Cloud
- Hibernate
- Mybatis
- MySQL教程
- MySQL函数
- NoSQL
- Redis
- MongoDB
- HBase
- Go语言
- C#
- MATLAB
- JavaScript
- Bootstrap
- HTML
- CSS教程
- PHP
- 汇编语言
- TCP/IP
- vi命令
- Android教程
- 区块链
- Docker
- 大数据
- 云计算