我試圖在html中使用css風格<select>標記。它在Firefox中正常工作，但不在鉻

Question

我試圖在CSS中使用CSS樣式標記。它適用於Firefox，但不適用於Chrome。這是我在樣式表單中使用的代碼。在通過互聯網提及一些我使用！重要的;命令以及這個樣式表。但它沒有奏效。

.style { 
    display: block; 
    border: none; 
    color: #333; 
    background: transparent; 
    border-bottom: 1px dotted gray; 
    padding: 5px 2px 0 2px; 
    width:300px; 
    font-size: 14; 
    color:#FFF; 
} 

.style:focus{ 
    outline: none; 
    border-color: #51CBEE; 
} 

Answer 1

乾脆？你不能。

Firefox允許你在<select>上做一些樣式，但在瀏覽器上不是一致的。

如果您確實希望將<select>設計爲交叉瀏覽器，則應該使用JavaScript屏蔽解決方案。可能Chosen或Selectize可以幫助你。

Answer 2

不幸的是，還沒有一個跨CSS瀏覽器兼容的樣式表單元素路徑：它通常不會留給設計師來控制其外觀/行爲，因此表單元素非常難以設計。許多瀏覽器都不允許你設計它們！

如果您需要在所有瀏覽器中獲得一致的外觀，唯一的途徑是使用JavaScript將風格化的HTML元素替換爲視圖中的表單元素。

下面是列出了一些可供您的選項的一篇文章：http://www.jquery4u.com/plugins/10-jquery-selectboxdrop-down-plugins/