我如何從文本框鍍鉻

刪除邊框要刪除其Chrome瀏覽器的文本框添加邊框。這是我已經試過的html和css。我如何從文本框鍍鉻

HTML：

<input id="searchbar" type="search" placeholder="Search" />

CSS：

input[type=search], 
input[type=search]:hover, 
input[type=search]:focus, 
input[type=search]:active 
{ 
    border: 0; 
    outline: none; 
    outline-offset: 0; 
    background-color:transparent 
}

請指點。在IE中沒有添加邊框，文本框看起來非常好。

更新：附着圖像（我想實現我在Chrome中看到IE10以及）

enter image description here

來源

2013-04-27 Sampat

添加-webkit-appearance:none;將解決它。這對WebKit中的表單控件有用。

來源

2013-04-27 11:53:56

感謝這工作d！ – Sampat 2013-04-27 16:58:31

添加outline:none必須解決您的問題。請提供您網站的網址

來源

2013-04-27 11:40:16

我已經@ int32_t的和@ soheil的解決方案都嘗試。即使Chrome和Safari使用相同的webkit引擎。 Safari和其他變種iOS，ipad & iphone的行爲有點不同。

因此

-webkit-appearance:none;

工作於Chrome，但不是在Safari

outline:none

工作在Safari和無法在Chrome

要在安全方面，你可以使用這個

.noBorderNoHeighlight{ 
    border: none;  /* Good browsers universal rule */ 
    outline: none;  /* safari and its variants */ 
    outline-offset: 0; /* IE and its variants */ 
    -webkit-appearance:none; /* Chrome and its variants */ 
}

來源

2014-06-20 12:45:59

我如何從文本框鍍鉻

回答

相關問題