如何将 CSS 类文件应用到菜单项控件。我有一个菜单控件,我必须更改菜单控件中项的颜色,所以我想将 CSS 类文件设置为菜单项怎么做?
<asp:Menu ID="Menu1" Orientation="Horizontal" Width="10%" runat="server">
<Items>
<asp:MenuItem NavigateUrl="~/Home.aspx" Text="HOME" Value="HOME" ></asp:MenuItem>
<asp:MenuItem NavigateUrl="~/Services.aspx" Text="Services" Value="Services"></asp:MenuItem>
</Items>
.staticSelectedStyle
{
background-color:Black;
color: Black;
border-bottom: solid 1px #eee;
z-index: 100;
position:static ;
}
.menu
{
color:red;
font-size:8pt;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head><title>
Untitled Page
</title><style type="text/css">
.Menu1_0 { background-color:white;visibility:hidden;display:none;position:absolute;left:0px;top:0px; }
.Menu1_1 { text-decoration:none; }
.Menu1_2 { width:10%; }
.Menu1_3 { border-style:none; }
.Menu1_4 { }
</style></head>
<body bgcolor="White">
<form name="form1" method="post" action="Home.aspx" id="form1">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTExMDkxNDM3NDBkZPybQbNBNXmmSEsEqSKyNytMNUMP" />
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<script src="/WebResource.axd?d=c13d03l4iRJYztoKmiA9KbiJvKkgLiZx2Ej3H51K9TkHC5oF5AnDj7i7I3pag2QP1kUUmWXfqmB-6_02vs8O-hVKwro1&t=634604623351482412" type="text/javascript"></script>
<script src="/WebResource.axd?d=pQc--vnbz5_GrPOMtzvfxI81FzBtntStkXAkQy1fKnh_ihqNd7bG0tjA4qeeYAUFrJCW8rMqbmZxY_x3y024GXcJdas1&t=634604623351482412" type="text/javascript"></script>
<div>
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgKWr/2HAQKM54rGBpc2vYbWOzz2bN+7+yXQhzJUEzlI" />
</div>
<div>
<a href="#Menu1_SkipLink"><img alt="Skip Navigation Links" src="/WebResource.axd?d=mP8Ot2JexWz7kq5vYEuSB3Fh38hbxIJW0VZEOr6Wh54N5ZYBu166FK7dh5c_y7rC1ZZeVhIaexIzk95Jfrt1BLeqkSw1&t=634604623351482412" width="0" height="0" style="border-width:0px;" /></a><table id="Menu1" class="menu Menu1_2" cellpadding="0" cellspacing="0" border="0">
<tr>
<td onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(event)" id="Menu1n0"><table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="white-space:nowrap;"><a class="Menu1_1" href="Home.aspx">HOME</a></td>
</tr>
</table></td><td style="width:3px;"></td><td onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(event)" id="Menu1n1"><table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="white-space:nowrap;"><a class="Menu1_1" href="Services.aspx">Services</a></td>
</tr>
</table></td>
</tr>
</table><a id="Menu1_SkipLink"></a>
</div>
<input type="submit" name="Button1" value="Button" id="Button1" class="menu" />
<script type="text/javascript">
//<![CDATA[
var Menu1_Data = new Object();
Menu1_Data.disappearAfter = 500;
Menu1_Data.horizontalOffset = 0;
Menu1_Data.verticalOffset = 0;
//]]>
</script>
</form>
</body>
</html>