css中搜索栏无法输入字

近日在开发一个网站时发现，搜索栏无法输入字，经过半天的查找和排查终于找到了问题所在，来分享一下吧。

 input[type="text"] {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
    } 

以上代码是去掉input文字框默认样式的代码，但是这段代码会导致在某些浏览器中搜索栏无法输入字。

解决方案：

 input[type="text"] {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
    }
    input[type="text"]:focus {
        outline: none;
    } 

在input[type="text"]的样式中添加:focus，解决了问题，可以在input框中输入文字了。

以上就是解决搜索栏无法输入字的问题的方法，大家可以在开发时注意一下这个问题哦。