Q

如何將CSS應用到Mac Chrome選擇框？

2014-04-13 38 views 20 likes

20

無論我使用Mac OSX 10.9.2和Chrome 33.0.1750.152，padding，background-color，我都無所謂，沒有任何效果。我真的只是想在select元素上應用padding-top和padding-bottom,5px，在MAC OSX上的任何地方都可以使用Chrome。是什麼賦予了？如何在全球所有平臺上做到這一點？如何將CSS應用到Mac Chrome選擇框？

2014-04-13 Solomon Closson

A

回答

37

在添加CSS以選擇webkit瀏覽器中的元素時，您需要應用-webkit-appearance:none;。

DEMO http://jsfiddle.net/XxkSC/3830/

2014-04-13 08:05:07 Vector

+0

哇，這是否也適用於其他瀏覽器？或者只是Chrome？我的意思是，其他瀏覽器也有一個前綴呢？ –

+4

好的，但我想在選擇框中的箭頭，但只是想添加填充。 '-webkit-appearance：none'刪除選擇框的箭頭，但是如何恢復？ –

+0

您可以使用背景圖像TUTORIAL http://bavotasan.com/2011/style-select-box-using-only-css/ – Vector

2

以下屬性添加到您的選擇在你的CSS文件：

-webkit-appearance:none;

2014-04-13 08:05:37 pconnor88

+2

好吧，但我想要選擇框中的箭頭，但只是想添加填充。 '-webkit-appearance：none'刪除選擇框的箭頭，但是如何恢復？ –

+0

@ Almog_0答案解決箭頭問題。 – Mike

7

有更好的選擇，達到自然的設計：

height:30px; 
background:#ffffff;

ps

向量的答案隱藏在右側的箭頭。

2016-02-04 12:31:50

+0

哦哇，所以填充不起作用，但高度和邊界呢？！似乎很隨意.. – Erfan

相關問題