5

我已经尝试了很多东西......但边界不会消失。如果你用 type="text" 替换 type="search" 效果很好，但我希望这不是我需要做的。

我试图杀死它

input{
    background:transparent;
    border:0;
    border-color:transparent;
    outline:none;
    width:150px;
}​

但他们似乎都没有完成这项工作。

http://jsfiddle.net/Kf9Mu/

有任何想法吗？

4

4 回答 4

12

显然 Webkit 对搜索输入字段有自定义样式。您可以直接摆脱它，然后应用您自己的边框。我在这里删除它并给它一个红色边框。

input{
  -webkit-appearance: none;
  border: 1px solid red;
}​

http://jsfiddle.net/Kf9Mu/7/

我只在 Chrome 中看过这个。

于 2012-06-03T23:48:13.190 回答
4

你应该试试

-webkit-appearance: none;

另请参阅http://37signals.com/svn/posts/2609-customizing-web-forms-with-css3-and-webkit

于 2012-06-03T23:49:40.020 回答
0

试试这个：

input:focus {
    outline: none;
}
于 2012-06-03T23:49:41.723 回答
0

不要忘记-webkit-user-select: none;

于 2013-03-22T18:58:06.450 回答