下拉列表项背景颜色变化

dropdown ListItem background color change

我正在尝试将 DropDown 的背景色设为透明,即使对于 Listitem 也是如此。

 <asp:Label ID="Label1" runat="server"  Text="Language : " style="color:white;padding:0 2px 0 2px;background-color: transparent !important;" />
                     <asp:DropDownList ID="ddlLanguages" runat="server" AutoPostBack="true" style="color:black;background-color: transparent !important;" >
                         <asp:ListItem style="background-color:transparent" Text="English" Value="en-us" />
                         <asp:ListItem style="background-color:transparent" Text="French" Value="fr" />
                          </asp:DropDownList><span style="color: white;;padding:0 2px 0 2px;"> | </span>

但即使在我的主 CSS 文件中添加 css 也不起作用

select.tt-dropdown-menu {
background-color: transparent !important;
}

select.tt-dropdown-menu .tt-suggestions .tt-suggestion {
cursor: pointer;
border-bottom: 1px solid #000; 
}

不确定为什么不起作用。任何建议!!

实际上,将背景颜色更改为透明根本没有任何效果。那是因为 select 选项容器有一些属性首先由浏览器定义,其次由操作系统定义。这意味着如果您将 ListItem 的背景颜色更改为透明,则容器的颜色为白色,您将无法发现差异。除了透明之外,您可以使用 js/jquery 脚本更改奇数、偶数元素的颜色:

window.onload = function () {
            $("#<%=ddlLanguages.ClientID%> option:odd").css("background-color", "red");
            $("#<%=ddlLanguages.ClientID%> option:even").css("background-color", "blue");
        }

这可以通过 css 实现,但我认为 jquery 在 Web 表单中实施是更稳定的选择