css - 如何将 CSS 类文件设置为菜单项控件-6ren

css - 如何将 CSS 类文件设置为菜单项控件

转载作者：行者123 更新时间：2023-11-28 13:44:48

如何将 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&amp;t=634604623351482412" type="text/javascript"></script>


<script src="/WebResource.axd?d=pQc--vnbz5_GrPOMtzvfxI81FzBtntStkXAkQy1fKnh_ihqNd7bG0tjA4qeeYAUFrJCW8rMqbmZxY_x3y024GXcJdas1&amp;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&amp;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>

最佳答案

查看 msdn:http://msdn.microsoft.com/en-us/library/ms366731.aspx

<asp:menu id="NavigationMenu2"
  staticdisplaylevels="3"
  orientation="Vertical"
  target="_blank"  
  runat="server"
  CssClass="menu2">

<levelsubmenustyles>
  <asp:submenustyle CssClass="level1" />
  <asp:submenustyle CssClass="level2"/> 
</levelsubmenustyles>

在这种情况下，第 1 层将是您的菜单，第 2 层是其元素。

关于css - 如何将 CSS 类文件设置为菜单项控件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12001524/