input输入框美化

Posted mrandon

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了input输入框美化相关的知识,希望对你有一定的参考价值。

简介

在设置input的适合,你会觉得默认的input样式并不好看。那么该怎么优化呢?

默认的input

技术图片

可以从上面看出,这个样式的确不好看。

优化input样式

设置 outline-style: none ; 取消外边框

技术图片

可以从上图看出,在点击输入input的适合,框边就显示比较粗的边框,那么怎么将这个样式取消呢?



作者:DevOps海洋的渔夫
链接:https://www.jianshu.com/p/9b4b60b8d475
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

以上是关于input输入框美化的主要内容,如果未能解决你的问题,请参考以下文章

更加美化输入框的方法

input输入框添加内部图标

美化input type=range标签滑动样式(带渐变效果)

微信小程序输入框禁止自动弹出

NGUI input输入框转载见图片水印

input的placeholder美化