選擇框和複選框替換

Question

我正在尋找一種明智的方式如何使用CSS設置選擇框，複選框和/或單選按鈕樣式。因爲瀏覽器的渲染引擎的工作方式，我知道你不能用純CSS做到這一點。

但是，有沒有JavaScript樣式這些HTML元素的方式？他們是否在主流瀏覽器上工作？

Answer 1

Dojo包含一些DHTML實現的小部件，可以將這些小部件替換爲許多頁面。當有人關閉了JS時，它會優雅地降到本地。

Answer 2

你可以逐漸增強一個選擇，將其全部替換爲標籤並對標籤進行樣式設置，使其看起來像下拉菜單，然後在click和可能的keydown事件上附加事件處理程序以打開包含跨度的同級div其中包含值屬性（或者將數據保存在js中，但以這種方式更容易），然後將單獨的單擊事件處理程序附加到跨度。您需要將附加的Click處理程序附加到文檔中，並且如果事件對象的目標不在生成的下拉列表中，請關閉它，並且您可能還需要其他一些邏輯。

這可能首先是不可訪問的，您可以嘗試通過附加鍵盤事件處理程序使其更易於訪問，但它很實用。

Answer 3

選擇列表與CSS完美匹配。也就是說，IE < 8除外，它們將其替換爲OS控件。

至於複選框和單選按鈕，那麼是的，它們並不是真的用CSS來調整樣式。這就是它的方式，但有時你可以在它們上面設置顏色。我認爲讓他們保持原樣是可以的。