养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

html怎么把密码框设置成一条直线

时间:2024-10-24 00:30:41

有时候我们在编写html页面的时候,想把密码框设置成一条直线,怎么实现呢,下面来分享一下方法

工具/原料

电脑

html

方法/步骤

1、第一步在我们的电脑上打开软件,新建一个html页面,如下图所示:

html怎么把密码框设置成一条直线

2、第二步html页面body里面,新建一个用户名和一个密码文本框,密码框的id设为text,亿姣灵秀类型为password,如下图所示:

html怎么把密码框设置成一条直线

3、第三步我们在浏览器中打开html页面,可以看到这是一个简单的登录界面,密码框还没有变成直线,如下图所示:

html怎么把密码框设置成一条直线

4、第四步我们给id为text的密码框添加上css样式,设置密码框的上,左,右边框都为0px,蛴蛩钔淞下边框border-bottom:#6661pxsolid;,这样就密码框就变成了一条直线,如下图所示:

html怎么把密码框设置成一条直线

5、第五步在浏览器中打开页面,可以看到密码框默认是一条直线,在输入密码的时候,框变成虚线框,如下图所示:

html怎么把密码框设置成一条直线

6、第六步在密码框输入密码完之后,可以看到密码框变成一条直线,如下图所示:

html怎么把密码框设置成一条直线

© 一点知识