程序博客网 > 迅雷网络

asp.net menu 控件样式 范例横向

来源：互联网 发布：迅雷网络 编辑：程序博客网 时间：2024/04/30 13:17

 <asp:Menu
    AccessKey="string"
    BackColor="color name|#dddddd"
    BorderColor="color name|#dddddd"
    BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
        Inset|Outset"
    BorderWidth="size"
    CssClass="string"
    DataSource="string"
    DataSourceID="string"
    DisappearAfter="integer"
    DynamicBottomSeparatorImageUrl="uri"
    DynamicEnableDefaultPopOutImage="True|False"
    DynamicHorizontalOffset="integer"
    DynamicItemFormatString="string"
    DynamicPopOutImageTextFormatString="string"
    DynamicPopOutImageUrl="uri"
    DynamicTopSeparatorImageUrl="uri"
    DynamicVerticalOffset="integer"
    Enabled="True|False"
    EnableTheming="True|False"
    EnableViewState="True|False"
    Font-Bold="True|False"
    Font-Italic="True|False"
    Font-Names="string"
    Font-Overline="True|False"
    Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
        Large|X-Large|XX-Large"
    Font-Strikeout="True|False"
    Font-Underline="True|False"
    ForeColor="color name|#dddddd"
    Height="size"
    ID="string"
    ItemWrap="True|False"
    MaximumDynamicDisplayLevels="integer"
    OnDataBinding="DataBinding event handler"
    OnDataBound="DataBound event handler"
    OnDisposed="Disposed event handler"
    OnInit="Init event handler"
    OnLoad="Load event handler"
    OnMenuItemClick="MenuItemClick event handler"
    OnMenuItemDataBound="MenuItemDataBound event handler"
    OnPreRender="PreRender event handler"
    OnUnload="Unload event handler"
    Orientation="Horizontal|Vertical"
    PathSeparator="string"
    runat="server"
    ScrollDownImageUrl="uri"
    ScrollDownText="string"
    ScrollUpImageUrl="uri"
    ScrollUpText="string"
    SkinID="string"
    SkipLinkText="string"
    StaticBottomSeparatorImageUrl="uri"
    StaticDisplayLevels="integer"
    StaticEnableDefaultPopOutImage="True|False"
    StaticItemFormatString="string"
    StaticPopOutImageTextFormatString="string"
    StaticPopOutImageUrl="uri"
    StaticSubMenuIndent="size"
    StaticTopSeparatorImageUrl="uri"
    Style="string"
    TabIndex="integer"
    Target="string"
    ToolTip="string"
    Visible="True|False"
    Width="size"
>
        <DataBindings>
                <asp:MenuItemBinding
                    DataMember="string"
                    Depth="integer"
                    Enabled="True|False"
                    EnabledField="string"
                    FormatString="string"
                    ImageUrl="uri"
                    ImageUrlField="string"
                    NavigateUrl="uri"
                    NavigateUrlField="string"
                    PopOutImageUrl="uri"
                    PopOutImageUrlField="string"
                    Selectable="True|False"
                    SelectableField="string"
                    SeparatorImageUrl="uri"
                    SeparatorImageUrlField="string"
                    Target="string"
                    TargetField="string"
                    Text="string"
                    TextField="string"
                    ToolTip="string"
                    ToolTipField="string"
                    Value="string"
                    ValueField="string"
                />
        </DataBindings>
        <DynamicHoverStyle />
        <DynamicItemTemplate>
            <!-- child controls -->
        </DynamicItemTemplate>
        <DynamicMenuItemStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|
                Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalPadding="size"
            ItemSpacing="size"
            OnDisposed="Disposed event handler"
            VerticalPadding="size"
            Width="size"
        />
        <DynamicMenuStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|
                Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalPadding="size"
            OnDisposed="Disposed event handler"
            VerticalPadding="size"
            Width="size"
        />
        <DynamicSelectedStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|
                Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalPadding="size"
            ItemSpacing="size"
            OnDisposed="Disposed event handler"
            VerticalPadding="size"
            Width="size"
        />
        <Items />
        <LevelMenuItemStyles>
                <asp:MenuItemStyle
                    BackColor="color name|#dddddd"
                    BorderColor="color name|#dddddd"
                    BorderStyle="NotSet|None|Dotted|Dashed|Solid|
                        Double|Groove|Ridge|Inset|Outset"
                    BorderWidth="size"
                    CssClass="string"
                    Font-Bold="True|False"
                    Font-Italic="True|False"
                    Font-Names="string"
                    Font-Overline="True|False"
                    Font-Size="string|Smaller|Larger|XX-Small|
                        X-Small|Small|Medium|Large|X-Large|XX-Large"
                    Font-Strikeout="True|False"
                    Font-Underline="True|False"
                    ForeColor="color name|#dddddd"
                    Height="size"
                    HorizontalPadding="size"
                    ItemSpacing="size"
                    OnDisposed="Disposed event handler"
                    VerticalPadding="size"
                    Width="size"
                />
        </LevelMenuItemStyles>
        <LevelSelectedStyles>
                <asp:MenuItemStyle
                    BackColor="color name|#dddddd"
                    BorderColor="color name|#dddddd"
                    BorderStyle="NotSet|None|Dotted|Dashed|Solid|
                        Double|Groove|Ridge|Inset|Outset"
                    BorderWidth="size"
                    CssClass="string"
                    Font-Bold="True|False"
                    Font-Italic="True|False"
                    Font-Names="string"
                    Font-Overline="True|False"
                    Font-Size="string|Smaller|Larger|XX-Small|
                        X-Small|Small|Medium|Large|X-Large|XX-Large"
                    Font-Strikeout="True|False"
                    Font-Underline="True|False"
                    ForeColor="color name|#dddddd"
                    Height="size"
                    HorizontalPadding="size"
                    ItemSpacing="size"
                    OnDisposed="Disposed event handler"
                    VerticalPadding="size"
                    Width="size"
                />
        </LevelSelectedStyles>
        <LevelSubMenuStyles>
                <asp:SubMenuStyle
                    BackColor="color name|#dddddd"
                    BorderColor="color name|#dddddd"
                    BorderStyle="NotSet|None|Dotted|Dashed|Solid|
                        Double|Groove|Ridge|Inset|Outset"
                    BorderWidth="size"
                    CssClass="string"
                    Font-Bold="True|False"
                    Font-Italic="True|False"
                    Font-Names="string"
                    Font-Overline="True|False"
                    Font-Size="string|Smaller|Larger|XX-Small|
                        X-Small|Small|Medium|Large|X-Large|XX-Large"
                    Font-Strikeout="True|False"
                    Font-Underline="True|False"
                    ForeColor="color name|#dddddd"
                    Height="size"
                    HorizontalPadding="size"
                    OnDisposed="Disposed event handler"
                    VerticalPadding="size"
                    Width="size"
                />
        </LevelSubMenuStyles>
        <StaticHoverStyle />
        <StaticItemTemplate>
            <!-- child controls -->
        </StaticItemTemplate>
        <StaticMenuItemStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|
                X-Small|Small|Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalPadding="size"
            ItemSpacing="size"
            OnDisposed="Disposed event handler"
            VerticalPadding="size"
            Width="size"
        />
        <StaticMenuStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|
                Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalPadding="size"
            OnDisposed="Disposed event handler"
            VerticalPadding="size"
            Width="size"
        />
        <StaticSelectedStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|
                Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalPadding="size"
            ItemSpacing="size"
            OnDisposed="Disposed event handler"
            VerticalPadding="size"
            Width="size"
        />
</asp:Menu>


下面的示例提供 Menu 控件的声明性代码。

<asp:menu id="NavigationMenu1" CssClass="menu1"  staticdisplaylevels="3"  staticsubmenuindent="0"   orientation="Vertical"  target="_blank"  Font-names="Arial, Gill Sans"  Width="100px"  runat="server">  <LevelMenuItemStyles>    <asp:MenuItemStyle CssClass="level1"/>    <asp:MenuItemStyle CssClass="level2"/>    <asp:MenuItemStyle CssClass="level3" />  </LevelMenuItemStyles>    <StaticHoverStyle CssClass="hoverstyle"/>    <LevelSubMenuStyles>    <asp:SubMenuStyle CssClass="sublevel1" />  </LevelSubMenuStyles>    <items>    <asp:menuitem text="Home" tooltip="Home">    <asp:menuitem text="Section 1" tooltip="Section 1">      <asp:menuitem text="Item 1" tooltip="Item 1"/>      <asp:menuitem text="Item 2" tooltip="Item 2"/>      <asp:menuitem text="Item 3" tooltip="Item 3"/>    </asp:menuitem>    <asp:menuitem text="Section 2" tooltip="Section 2">      <asp:menuitem text="Item 1" tooltip="Item 1"/>      <asp:menuitem text="Item 2" tooltip="Item 2">        <asp:MenuItem Text="Subitem 1"/>        <asp:menuitem Text="Subitem 2" />      </asp:menuitem>      <asp:menuitem text="Item 3" tooltip="Item 3"/>    </asp:menuitem>  </asp:menuitem>  </items></asp:menu>
Menu 控件的 CSS 代码。
.level1{    color: White;    background-color: Black;    font-variant: small-caps;    font-size: large;    font-weight: bold;}.level2{    color: Blue;    font-family: Gill Sans MT !important;    font-size: medium;    background-color: Gray;}.level3{    color: black;    background-color: Silver;    font-family: Gill Sans MT !important;    font-size: small;}.hoverstyle{    font-weight: bold;}       .sublevel1{    background-color: Gray !important;    color: White !important;    font-variant: small-caps;}  




asp.net menu 控件样式 范例横向

<asp:Menu ID="mnuTopMenu" runat="server" DynamicEnableDefaultPopOutImage="False"
                    DynamicHorizontalOffset="-1" Font-Bold="false" Orientation="Horizontal" StaticEnableDefaultPopOutImage="False"
                    StaticSubMenuIndent="10px" DisappearAfter="600"
                    StaticSelectedStyle-CssClass="StaticSelectedStyle"
                    StaticMenuItemStyle-CssClass="StaticMenuItemStyle"
                    StaticHoverStyle-CssClass="StaticHoverStyle"
                    DynamicMenuStyle-CssClass="DynamicMenuStyle"
                    DynamicSelectedStyle-CssClass="DynamicSelectedStyle"
                    DynamicMenuItemStyle-CssClass="DynamicMenuItemStyle"
                    DynamicHoverStyle-CssClass="DynamicHoverStyle"
                     onmenuitemclick="mnuTopMenu_MenuItemClick">
                  <Items></Items>
                </asp:Menu>
/*Start    顶部菜单////////////////////////////////////////////////////////////************/


.mnuTopMenu
{
    background-color:Transparent;
    font-family: 宋体;
    font-size: 12px;
    position:relative;
    top:34px;
}

.DynamicMenuStyle /*动态菜单矩形区域样式*/
{
    background-color: white;
    border: solid 1px #ACC3DF;
    padding: 1px 1px 1px 1px;
    text-align: left;
}

.DynamicHoverStyle /*动态菜单项:鼠标悬停时的样式*/
{
    background-color: #F7DFA5;/*#7C6F57;*/
    color: #333333;
}

.DynamicSelectedStyle /*动态菜单项:选择时的样式*/
{
    /*background-color:Gainsboro;*/
    color: red;
}

.DynamicMenuItemStyle /*动态菜单项样式*/
{
    padding: 2px 5px 2px 5px;
    color: #333333;
}


.StaticSelectedStyle /*静态菜单项:选择时的样式*/
{
    /*background-color:Gainsboro;*/
    color: red;
}

.StaticMenuItemStyle /*静态菜单项样式*/
{
    cursor: hand;
    padding: 2px 5px 2px 5px;
    color: #333333;
    background-color::Transparent;
}

.StaticHoverStyle /*静态菜单项:鼠标悬停时的样式*/
{
    background-color: #84BCCD;/*#7C6F57;*/
    cursor: hand;
    color: #333333;
}

/*End    顶部菜单////////////////////////////////////////////////////////////************/
在页面中加入
             <div id="menu">
                    <asp:SiteMapDataSource ID="siteMapDS" runat="server" ShowStartingNode="false" />
                    <asp:Menu runat="server" ID="mainMenu" DataSourceID="siteMapDS" Orientation ="horizontal">
                   </asp:Menu> 
             </div> 
在主题的皮肤文件中写入下列代码:  
<asp:Menu runat="server"
 DynamicHorizontalOffset="6"
 StaticPopOutImageUrl="Images/flyout.gif"
 DynamicPopOutImageUrl="Images/flyout.gif"   >
    <StaticMenuStyle Width="180px" Font-Size="Medium" />
    <StaticMenuItemStyle CssClass="menuNormal" VerticalPadding="6" />
    <StaticHoverStyle CssClass="menuHover" />
    <StaticSelectedStyle CssClass="menuSelected" />
    <DynamicMenuStyle CssClass="subMenu" />
    <DynamicMenuItemStyle CssClass="subMenuNormal" Width="188px" VerticalPadding="6" />
    <DynamicHoverStyle CssClass="subMenuHover" Width="180px" />     
</asp:Menu> 
 
上述代码的含义可以参考MSDN,但是这里列出一些:
Menu. DynamicHorizontalOffset:获取或设置动态菜单相对于其父菜单项的水平移动像素数。
  Menu.DynamicVerticalOffset:获取或设置动态菜单相对于其父菜单项的垂直移动像素数。
Menu.StaticPopOutImageUrl:获取或设置显示来指示静态菜单项包含子菜单的图像的 URL。
DynamicPopOutImageUrl:获取或设置自定义图像的 URL，如果动态菜单项包含子菜单，该图像则显示在动态菜单项中。
Menu.DisappearAfter 属性 :获取或设置鼠标指针不再置于菜单上后显示动态菜单的持续时间。 
Menu.DynamicBottomSeparatorImageUrl 属性 :获取或设置图像的 URL，该图像显示在各动态菜单项底部，将动态菜单项与其他菜单项隔开。
等等...
StaticMenuStyle:使用该对象可以设置静态菜单的外观。
StaticMenuItemStyle:使用该对象可以设置静态菜单中的菜单项的外观.也就是没有被选中项的样式.
StaticHoverStyle:使用该对象可以设置鼠标指针置于静态菜单项上时的菜单项外观。也就是鼠标指上去的时候,显示的外观.
DynamicMenuStyle:使用该对象可以设置动态菜单的外观。 也就是弹出菜单的样式. 
 
一个参考的CSS代码:
  
#menu {
       position:absolute;
       left: 40px;
       top:0;
       width: 180px;
}
#menu a {                   
       display:block !important;
       margin-left:40px;    
       background-image: none !important;
       background-repeat: no-repeat;
}             
#menu .menuNormal {
       color: #FFFFFF;
       font-weight:bold;      
}
#menu .menuHover
{
       background-color: #D8C68D;
       color: #ffffcc;
      background-image: url(Images/img_menu_hover.gif);
       background-repeat: no-repeat;
}
#menu .menuSelected {
       background-color: #D8C68D;
       color: #304012;
      background-image: url(Images/img_menu_active.gif);
       background-repeat:no-repeat;
}
#menu .subMenu table
{
       background-color: #ff0066;
       background-image: url(Images/subMenu_bg1.gif);
       background-repeat: repeat-y;
       color: #ff0066; 
 
}
#menu .subMenuNormal {
       color:#FFFFFF;
       font-weight:bold;
}
#menu .subMenuHover td{
       background-color:#D8C68D;
       background-image: url(Images/img_menu_hover.gif);
       background-repeat:no-repeat;
       color:#8E985E;
}
html>body #menu .subMenuHover{      
background-color:#D8C68D;

       color: #8E985E; 
     background-image: url(Images/img_menu_hover.gif); 
      background-repeat:no-repeat;
}
html>body #menu .subMenuHover td{
      background-color:transparent;
      background-image:none;
}

	
				
		









 迅雷网络
    		迅雷网络



原创粉丝点击



		

热门IT博客


阿里云数据库价格阿里云数据库价格




实施工程师前景知乎实施工程师前景知乎




北京兄弟连it教育




人工智能专业世界排名




mac安装ug教程




mac退出全屏快捷键




2018经济全球化的数据




淘宝店如何关闭店铺




linux判断网络 脚本




同声翻译哪个软件好




印加 知乎




p2p数据分析思路




反洗钱岗位 知乎




淘宝小号查询软件




ie11淘宝不显示图片




175平台游戏数据异常




linux进入vi编辑器




怎样在淘宝找客源




旅游cms




外卖抢单软件



		

热门问题
    老师的惩罚
    人脸识别
    我在镇武司摸鱼那些年
    重生之率土为王
    我在大康的咸鱼生活
    盘龙之生命进化
    天生仙种
    凡人之先天五行
    春回大明朝
    姑娘不必设防，我是瞎子
    5岁孩子身高体重标准
    5岁宝宝身高体重标准
    欧5标准对应国几
    5米标准视力表大图
    5g收费标准
    国5标准
    5岁小孩身高体重标准
    5厘米标准实物图
    5周岁男孩标准身高
    5岁半男孩身高体重标准值
    宝宝5个月发育标准
    5岁男宝宝身高体重标准
    宝宝5月发育标准
    5岁儿童视力标准
    5g标准推迟三个月
    欧尚 2017款 1.5l 手动标准型
    6个月宝宝发育标准
    6岁男孩身高体重标准
    国6标准
    女性激素6项检查参考标准
    6周岁男孩身高体重标准
    6岁女孩身高体重标准
    6岁儿童身高体重标准表
    6s标准
    6岁宝宝身高体重标准
    6岁的小孩身高多少是标准
    国6标准的车有哪些
    伤残6级赔偿标准
    6克盐标准容器图片
    6级伤残赔偿标准
    哪些手机支持wifi6标准
    长沙世界之窗2019收费标准
    率土之滨标准小魏骑
    三之三幼儿园收费标准
    永恒之塔收费标准
    2018年物业滞纳金标准千分之三
    标准紧固件
    邮政寄件收费标准
    京东上门取件收费标准
    菜鸟驿站寄件收费标准
    标准件有哪些


	










程序博客网，程序员的互联网技术博客家园。csdn论坛精品 msdn技术资料都在这里