使用CSS更改ASP.NET中dropdownlist選定項目的背景顏色

我想更改下拉列表，列表框和文本框中所選項目的背景顏色。這可能與CSS？使用CSS更改ASP.NET中dropdownlist選定項目的背景顏色

感謝

UPDATE

只是嘗試這樣做CSS：

::-moz-selection 
{ 
    background-color:#8CCA1E; 
    color:Black; 
}

的偉大工程選定的文本，但不是爲dropdownlists或列表框懸停顏色或所選項目的顏色。

來源

2010-11-15 Mark Allison

您將遇到-moz-selection的兼容性問題。 IE6不支持它，不能對IE7或IE8說話，但我懷疑7至少沒有 – 2010-11-15 18:40:47

@James B--沒關係我只在內部網中使用Firefox。 – 2010-11-15 18:45:52

幸運！：）.... – 2010-11-15 19:19:57

您可以在.aspx頁面中通過指定CssClass屬性，或將背景色屬性設置背景顏色..它看起來像：

<asp:ListBox CssClass="MyListBox" BackColor="#e0e0e0"></asp:ListBox>

設置選擇的項目是有點棘手......我不相信這是直接的屬性。你可以將它設置在JavaScript，或者jQuery的，是這樣的：

// Never mind, this won't work 
<script type="text/javascript"> 
    $(document).ready(function() { 
    $('#MyListBox').click(function() { 
     $("#MyListBox option:selected").css("background-color", "#e0e0e0"); 
    }); 
    }); 
</script>

我會測試，以確保它的工作原理...如果你需要一個直JavaScript的解決方案，我要看看我能想出什麼用。但是，如果你不使用jQuery，並且想要對你的控件進行細粒度的控制，現在是學習它的好時機：）

感謝賈斯丁對腳本的更正！

編輯
哈弗很容易...添加樣式：

select > option:hover { 
    background-color: #ffffd0; 
    }

，將設置背景顏色上你將鼠標懸停在頁面上的任何列表框項目。 jQuery的可以用來設置所有列表框點擊功能，而不僅僅是具體#MyListBox，給我一兩分鐘，我會添加一些代碼

UPDATE
廣泛的研究後，筋疲力盡我所擁有的每一種資源，或者可以放在我手上的資源，我想出的最佳答案是：設置所選顏色無法完成。

甚至沒有我想出的jQuery代碼將工作。所選顏色由OS設置，不能被覆蓋。

對不起，盡我所能做的就是在：hover僞選擇
：（

來源

2010-11-15 16:56:36

我正在使用jQuery，並且我的web表單上有很多下拉菜單。有沒有辦法將懸停顏色和選定的顏色應用於所有這些顏色？我不想設置背景顏色，只是使用jQuery懸停和選擇顏色。謝謝！ – 2010-11-18 14:13:04

大多數**重要**部分閱讀這裏，我開始看到一遍又一遍的是這個評論：_甚至我想出的jQuery代碼將工作。所選的顏色由操作系統設置，並且不能被覆蓋._我看到很多帖子，其中人們喋喋不休地用'jQuery'代碼片段來更改CSS，但從不測試它。到目前爲止，我可以更改非選定元素的背景顏色，但所選顏色不可覆蓋。 – atconway 2013-09-24 16:00:14

您可以爲此創建CSS規則並以編程方式將其應用於代碼中的更改處理程序中。或者你可以利用System.Drawing命名空間在你的處理程序中實現同樣的功能。

// CSS 
.dropDownBackColor { background-color:#00ff00; } 

// Code-Behind: in your selected index changed event handler 
// for the drop down list 
ddl.CssClass = "dropDownBackColor";

ddl.BackColor = System.Drawing.Color.Yellow;

來源

2010-11-15 15:01:27 IrishChieftain

這不會只是改變下拉的背景顏色？我只想更改懸停顏色和選定的顏色。有沒有辦法做到這一點編程？ – 2010-11-15 22:24:45

然後，我認爲jQuery將是兩種方式:-) – IrishChieftain 2010-11-15 23:09:30

另一種方法是使用JS ..

<asp:DropDownList ID="DropDownList1" runat="server" onchange="SelectedItemCLR(this);"> 
    <asp:ListItem Text="Name1" Value="1"></asp:ListItem> 
    <asp:ListItem Text="Name2" Value="2"></asp:ListItem> 
    <asp:ListItem Text="Name3" Value="3"></asp:ListItem>

<script type="text/javascript"> 
    function SelectedItemCLR(source) { 

     for (var i = 0; i < source.options.length; i++) { 
     if (i != source.selectedIndex) 
       source.options[i].style.backgroundColor = "White"; 
      else 
       source.options[i].style.backgroundColor = "Red"; 

     } 
    }

來源

2010-11-15 17:03:28 AspNetDev

謝謝，我想要在我的CSS文件中定義顏色 - 有沒有辦法用JS做到這一點？我不想在我的asp頁面中使用硬編碼的顏色。 – 2010-11-15 18:18:37

我想你可以指定CSS類，就像這樣.. source.options [i] .className =「YourCSS Name」; – AspNetDev 2010-11-15 19:24:37

你可能想嘗試的CSS選擇器::選擇這聽起來像它會做你想要什麼。 Here's關於它的一篇好文章。唯一的問題是它似乎只是css3，所以你可能想要嘗試jB的解決方案James B發佈，這取決於你的瀏覽器要求。

來源

2010-11-15 17:06:13 mwgriffith

酷，我正在使用一個現代的瀏覽器，並不需要擔心支持舊瀏覽器。所以，一個CSS3解決方案將是完美的。我已經嘗試過使用我的問題中更新的代碼，但下拉菜單和列表框中的懸停顏色不會更改。選定的文本雖然工作正常。你知道如何改變懸停顏色和下拉列表和列表框中的選定項目的顏色嗎？ – 2010-11-15 18:15:28

看起來Chrome的工作方式與Firefox http://code.google.com/p/chromium/issues/detail?id=62263的工作方式相同。你也碰巧嘗試input :: moz-selection爲你的選擇器？ – mwgriffith 2010-11-16 19:19:05

是的我試過輸入:: - moz-selection也沒有區別。 – 2010-11-23 10:59:18

使用CSS更改ASP.NET中dropdownlist選定項目的背景顏色

回答

相關問題