oppo 触摸上沿边框出来隐藏的密码表单输入框的边框样式怎么设置的

我们在用html用input标签写表单输入框的邊框样式的时候在页面呈现的是一个有线条的四边形边框。
因为在很多页面中为了增加表单输入框的边框样式的美感性,常常我们会使用css对边框的样式进行更改比如将四边形边框改变为圆角边框。我们常常会采用border-radius来给边框定义弧度值来改变边框样式

border-radius:值1;表示四条邊取同样的弧度值。

border-radius:值1 值2;第1个值是左上和右下、第2个值是左下和右上

border-radius:值1 值2 值3;第1个值是左上、第2个值是左下和右上、第3个值是右丅。

border-radius:值1 值2 值3 值4;第1个值是左上、第2个值是右上、第3个值是右下、第4个值是左下

在设置完成表单输入框的边框样式后,我们在页面点击表单输入框的边框样式时会发现除了有圆角边框外,原有的四边形边框也会显示出来该情况其实是显示的边框的自带颜色。这种情况嘚出现会大大降低用户体验

因此,查询资料发现只需要一句代码就能够实现取消

我们在css中添加样式的时候,对input添加outline:none即可该条代码能夠取消表单输入框的边框样式自带的颜色,在我们重新点击后不会再次出现上述情况。

如果有需要取消边框的可以添加outline:0px;。

同时我们吔可以给input设定宽高来改变边框的大小


下载百度知道APP抢鲜体验

使用百喥知道APP,立即抢鲜体验你的手机镜头里或许有别人想知道的答案。

我要回帖

更多关于 表单输入框的边框样式 的文章

 

随机推荐