下拉列表项背景颜色变化
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 表单中实施是更稳定的选择
我正在尝试将 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 表单中实施是更稳定的选择