A Menu control is made up of a hierarchy of menu items represented by MenuItem objects. Each menu item has a read-only Depth property that specifies the level at which the menu item is displayed in the Menu control. Menu items at the top level (level 0) that do not have a parent menu item are called root menu items. A menu item that has a parent menu item is called a submenu item. All root menu items are stored in the Items collection. Submenu items are stored in a parent menu item's ChildItems collection. You can access a menu item's parent menu item by using the Parent property.

Note
The Items and ChildItems collections contain only the menu items for the next level down. To access menu items further down the menu tree, use the ChildItems property of a subsequent menu item.

To create the menu items for a Menu control, use one of the following methods:

Use declarative syntax to create static menu items.

Use a constructor to dynamically create new instances of the MenuItem class. These MenuItem objects can then be added to the Items or ChildItems collection.

Bind the Menu control to a data source. When the Menu control is bound to a SiteMapDataSource control, MenuItem objects are automatically created that correspond to the items in the data source. For other data sources, MenuItem objects are also automatically created that match the hierarchy structure of data source; however, you must also use the DataBindings collection to define the menu item bindings that specify the binding relationship between a menu item and its corresponding data item.

The menu items are displayed in either a static menu or a dynamic menu, depending on its level. The static menu is always displayed in a Menu control. By default, the menu items at the top level (level 0) are displayed in the static menu. You can display additional menu levels (static submenus) within the static menu by setting the StaticDisplayLevels property. Menu items (if any) with a higher level than the value specified by the StaticDisplayLevels property are displayed in a dynamic submenu. A dynamic submenu appears only when the user positions the mouse pointer over the parent menu item that contains a dynamic submenu.

When the user clicks a menu item, the Menu control can either navigate to a linked Web page or simply post back to the server. If the NavigateUrl property of a menu item is set, the Menu control navigates to the linked page; otherwise, it posts the page back to the server for processing. By default, a linked page is displayed in the same window or frame as the Menu control. To display the linked content in a different window or frame, use the Target property of the Menu control.

Note
The Menu..::.Target property affects every menu item in the control. To specify a window or frame for an individual menu item, set the Target property of the MenuItem object directly.

Each menu item has a Text and a Value property. The value of the Text property is displayed in the Menu control, while the Value property is used to store any additional data about the menu item, such as data passed to the postback event associated with the menu item. If you set the Text property, but leave the Value property unset, the Value property is automatically set with the same value as the Text property. The opposite is also true. If you set the Value property, but not the Text property, the Text property is automatically set with the same value as the Value property.

Note
Menu items at the same menu level must each have a unique value for the Value property; the Menu control cannot distinguish between different menu items at the same level that have the same value. In this scenario, if the user clicks a menu item that has a duplicate value, the menu item that appears first in the menu is selected.

To display a ToolTip when the user positions the mouse pointer over a menu item, set the item's ToolTip property.

A Menu control has several different types of menu items. You can control the style (such as font size and color) for the different menu item types by using the properties in the following table.

Instead of setting the individual style properties, you can specify styles that are applied to menu items based on their level by using the style collections shown in the following table.

The first style in the collection corresponds to the style of the menu items at the first depth level in the menu tree. The second style in the collection corresponds to the style of the menu items at the second depth level in the menu tree, and so on. This is most often used to generate table of contents-style navigation menus where menu items at a certain depth should have the same appearance, regardless of whether they have submenus.

Note
If you use any of the level style collections listed in the previous table to define the style for the Menu control, these style settings override the individual menu item style properties.

In addition to customizing a menu item's style, you can also customize its appearance. You can specify custom images for the different parts for a menu item by setting the properties in the following table.

To determine whether a menu item is currently selected in a Menu control, use the Selected property. You can also determine whether a menu item is bound to data by using the DataBound property. If a menu item is bound to data, you can use the DataItem property to access the values of the data item bound to the menu item.

For a list of initial property values for an instance of the MenuItem class, see the MenuItem constructor.

The following example demonstrates how to populate a Menu control with static MenuItem objects using declarative syntax.

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >
  <head runat="server">
    <title>MenuItem Declarative Example</title>
</head>
<body>
    <form id="form1" runat="server">

      <h3>MenuItem Declarative Example</h3>

      <!-- Use declarative syntax to create the   -->
      <!-- menu structure. Create submenu items   -->
      <!-- by nesting them within parent menu     -->
      <!-- items.                                 -->
      <asp:menu id="NavigationMenu"
        staticdisplaylevels="1"
        staticsubmenuindent="10" 
        orientation="Vertical" 
        target="_blank"  
        runat="server">

        <items>
          <asp:menuitem navigateurl="Home.aspx" 
            text="Home"
            imageurl="Images\Home.gif"
            popoutimageurl="Images\Popout.jpg"   
            tooltip="Home">
            <asp:menuitem navigateurl="Music.aspx"
              text="Music"
              popoutimageurl="Images\Popout.jpg"
              tooltip="Music">
              <asp:menuitem navigateurl="Classical.aspx" 
                text="Classical"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Classical"/>
              <asp:menuitem navigateurl="Rock.aspx"
                text="Rock"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Rock"/>
              <asp:menuitem navigateurl="Jazz.aspx"
                text="Jazz"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Jazz"/>
            </asp:menuitem>
            <asp:menuitem navigateurl="Movies.aspx"
              text="Movies"
              popoutimageurl="Images\Popout.jpg"              
              tooltip="Movies">
              <asp:menuitem navigateurl="Action.aspx"
                text="Action"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Action"/>
              <asp:menuitem navigateurl="Drama.aspx"
                text="Drama"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Drama"/>
              <asp:menuitem navigateurl="Musical.aspx"
                text="Musical"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Musical"/>
            </asp:menuitem>
          </asp:menuitem>
        </items>

      </asp:menu>

    </form>
  </body>
</html>

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >
  <head runat="server">
    <title>MenuItem Declarative Example</title>
</head>
<body>
    <form id="form1" runat="server">

      <h3>MenuItem Declarative Example</h3>

      <!-- Use declarative syntax to create the   -->
      <!-- menu structure. Create submenu items   -->
      <!-- by nesting them within parent menu     -->
      <!-- items.                                 -->
      <asp:menu id="NavigationMenu"
        staticdisplaylevels="1"
        staticsubmenuindent="10" 
        orientation="Vertical" 
        target="_blank"  
        runat="server">

        <items>
          <asp:menuitem navigateurl="Home.aspx" 
            text="Home"
            imageurl="Images\Home.gif"
            popoutimageurl="Images\Popout.jpg"   
            tooltip="Home">
            <asp:menuitem navigateurl="Music.aspx"
              text="Music"
              popoutimageurl="Images\Popout.jpg"
              tooltip="Music">
              <asp:menuitem navigateurl="Classical.aspx" 
                text="Classical"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Classical"/>
              <asp:menuitem navigateurl="Rock.aspx"
                text="Rock"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Rock"/>
              <asp:menuitem navigateurl="Jazz.aspx"
                text="Jazz"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Jazz"/>
            </asp:menuitem>
            <asp:menuitem navigateurl="Movies.aspx"
              text="Movies"
              popoutimageurl="Images\Popout.jpg"              
              tooltip="Movies">
              <asp:menuitem navigateurl="Action.aspx"
                text="Action"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Action"/>
              <asp:menuitem navigateurl="Drama.aspx"
                text="Drama"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Drama"/>
              <asp:menuitem navigateurl="Musical.aspx"
                text="Musical"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Musical"/>
            </asp:menuitem>
          </asp:menuitem>
        </items>

      </asp:menu>

    </form>
  </body>
</html>

The following example demonstrates how to bind a Menu control to a SiteMapDataSource control. When bound to a data source, the Menu control automatically creates the MenuItem objects. For this example to work correctly, you must copy the sample site map data below to a file named Web.sitemap.

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >

  <!-- For the hover styles of the Menu control to  -->
  <!-- work correctly, you must include this head   -->
  <!-- element.                                     -->
  <head runat="server">
    <title>Menu DataBinding Example</title>
</head>

  <body>
    <form id="form1" runat="server">

      <h3>Menu DataBinding Example</h3>

      <!-- Bind the Menu control to a SiteMapDataSource control.  -->
      <asp:menu id="NavigationMenu"
        disappearafter="2000"
        staticdisplaylevels="2"
        staticsubmenuindent="10" 
        orientation="Vertical"
        font-names="Arial" 
        target="_blank"
        datasourceid="MenuSource"   
        runat="server">

        <staticmenuitemstyle backcolor="LightSteelBlue"
          forecolor="Black"/>
        <statichoverstyle backcolor="LightSkyBlue"/>
        <dynamicmenuitemstyle backcolor="Black"
          forecolor="Silver"/>
        <dynamichoverstyle backcolor="LightSkyBlue"
          forecolor="Black"/>

      </asp:menu>

      <asp:SiteMapDataSource id="MenuSource"
        runat="server"/>        

    </form>
  </body>
</html>

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >

  <!-- For the hover styles of the Menu control to  -->
  <!-- work correctly, you must include this head   -->
  <!-- element.                                     -->
  <head runat="server">
    <title>Menu DataBinding Example</title>
</head>

  <body>
    <form id="form1" runat="server">

      <h3>Menu DataBinding Example</h3>

      <!-- Bind the Menu control to a SiteMapDataSource control.  -->
      <asp:menu id="NavigationMenu"
        disappearafter="2000"
        staticdisplaylevels="2"
        staticsubmenuindent="10" 
        orientation="Vertical"
        font-names="Arial" 
        target="_blank"
        datasourceid="MenuSource"   
        runat="server">

        <staticmenuitemstyle backcolor="LightSteelBlue"
          forecolor="Black"/>
        <statichoverstyle backcolor="LightSkyBlue"/>
        <dynamicmenuitemstyle backcolor="Black"
          forecolor="Silver"/>
        <dynamichoverstyle backcolor="LightSkyBlue"
          forecolor="Black"/>

      </asp:menu>

      <asp:SiteMapDataSource id="MenuSource"
        runat="server"/>        

    </form>
  </body>
</html>

The following is sample site map data for the previous example.

<siteMap>

<siteMapNode url="~\Home.aspx"

title="Home"

description="Home">

<siteMapNode url="~\Music.aspx"

title="Music"

description="Music">

<siteMapNode url="~\Classical.aspx"

title="Classical"

description="Classical"/>

<siteMapNode url="~\Rock.aspx"

title="Rock"

description="Rock"/>

<siteMapNode url="~\Jazz.aspx"

title="Jazz"

description="Jazz"/>

</siteMapNode>

<siteMapNode url="~\Movies.aspx"

title="Movies"

description="Movies">

<siteMapNode url="~\Action.aspx"

title="Action"

description="Action"/>

<siteMapNode url="~\Drama.aspx"

title="Drama"

description="Drama"/>

<siteMapNode url="~\Musical.aspx"

title="Musical"

description="Musical"/>

</siteMapNode>

</siteMapNode>

</siteMap>

.NET Framework

Windows 7, Windows Vista SP1 or later, Windows XP SP3, Windows XP SP2 x64 Edition, Windows Server 2008 (Server Core Role not supported), Windows Server 2008 R2 (Server Core Role not supported), Windows Server 2003 SP2

Reference

Un contrôle Menu est composé d'une hiérarchie d'éléments de menu représentée par les objets MenuItem. Chaque élément de menu a une propriété Depth en lecture seule qui spécifie le niveau auquel l'élément de menu est affiché dans le contrôle Menu. Les éléments de menu au niveau supérieur (niveau 0) qui n'ont pas d'élément de menu parent sont appelés éléments de menu racine. Un élément de menu qui a un élément de menu parent est appelé élément de sous-menu. Tous les éléments de menu racine sont stockés dans la collection Items. Les éléments de sous-menu sont stockés dans une collection ChildItems d'un élément de menu parent. Vous pouvez accéder à un élément de menu de parent d'un élément de menu à l'aide de la propriété Parent.

Remarque
Les collections Items et ChildItems contiennent uniquement les éléments de menu du dernier niveau vers le bas. Pour accéder aux éléments de menu plus en bas de l'arborescence du menu, utilisez la propriété ChildItems d'un élément de menu suivant.

Pour créer les éléments de menu d'un contrôle Menu, utilisez l'une des méthodes suivantes :

utilisez une syntaxe déclarative pour créer des éléments de menu statiques ;

utilisez un constructeur pour créer de manière dynamique des instances nouvelles de la classe MenuItem. Ces objets MenuItem peuvent ensuite être ajoutés à la collection Items ou ChildItems ;

lier le contrôle Menu à la source de données ; Lorsque le contrôle Menu est lié à un contrôle SiteMapDataSource, les objets MenuItem sont créés automatiquement et correspondent aux éléments de la source de données. Pour d'autres sources de données, les objets MenuItem sont également créés automatiquement et correspondent à la structure hiérarchique de source de données. Toutefois, vous devez également utiliser la collection DataBindings pour définir les liaisons d'éléments de menu qui spécifient la relation de liaison entre un élément de menu et son élément de données correspondant.

Les éléments de menu s'affichent dans un menu statique ou dans un menu dynamique, selon leur niveau. Le menu statique s'affiche toujours dans un contrôle Menu. Par défaut, les éléments de menu au niveau supérieur (niveau 0) s'affichent dans le menu statique. Vous pouvez afficher des niveaux de menu supplémentaires (sous-menus statiques) dans le menu statique en définissant la propriété StaticDisplayLevels. Les éléments de menu (le cas échéant) avec un niveau supérieur à la valeur spécifiée par la propriété StaticDisplayLevels s'affichent dans un sous-menu dynamique. Un sous-menu dynamique n'apparaît que lorsque l'utilisateur positionne le pointeur de la souris sur l'élément de menu parent qui contient un sous-menu dynamique.

Lorsque l'utilisateur clique sur un élément de menu, le contrôle Menu peut naviguer vers une page Web liée ou simplement effectuer une publication sur le serveur. Si la propriété NavigateUrl d'un élément de menu est définie, le contrôle Menu navigue vers la page liée ; sinon, il publie la page sur le serveur pour traitement. Par défaut, une page liée s'affiche dans la même fenêtre ou frame que le contrôle Menu. Pour afficher le contenu lié dans une fenêtre ou frame différent, utilisez la propriété Target du contrôle Menu.

Remarque
La propriété Menu..::.Target affecte chaque élément de menu du contrôle. Pour spécifier une fenêtre ou frame d'un élément de menu, définissez directement la propriété Target de l'objet MenuItem.

Chaque élément de menu a un Text et une propriété Value. La valeur de la propriété Text s'affiche dans le contrôle Menu, tandis que la propriété Value permet de stocker toutes les données supplémentaires relatives à l'élément de menu, telles que les données passées à l'événement de publication associé à l'élément de menu. Si vous définissez la propriété Text, mais que vous laissez la propriété Value non définie, la propriété Value est définie automatiquement avec la même valeur que la propriété Text. Le contraire est également vrai. Si vous définissez la propriété Value, et non la propriété Text, la propriété Text est définie automatiquement avec la même valeur que la propriété Value.

Remarque
Les éléments de menu au même niveau de menu doivent avoir chacun une valeur unique pour la propriété Value ; le contrôle Menu ne peut pas faire la distinction entre les différents éléments de menu au même niveau ayant la même valeur. Dans ce scénario, si l'utilisateur clique sur un élément de menu qui a une valeur en double, l'élément de menu qui apparaît en premier dans le menu est sélectionné.

Pour afficher une info-bulle lorsque l'utilisateur positionne le pointeur de la souris sur un élément de menu, définissez la propriété ToolTip de l'élément.

Un contrôle Menu a plusieurs types d'éléments de menu. Vous pouvez contrôler le style (par exemple la taille et la couleur de la police) des différents types d'éléments de menu à l'aide des propriétés du tableau suivant.

Au lieu de définir les propriétés de style, vous pouvez spécifier les styles qui sont appliqués aux éléments de menu en fonction de leur niveau à l'aide des collections de styles affichées dans le tableau suivant.

Le premier style de la collection correspond au style des éléments de menu au premier niveau de profondeur de l'arborescence du menu. Le deuxième style de la collection correspond au style des éléments de menu au deuxième niveau de profondeur de l'arborescence du menu, et ainsi de suite. Ce mécanisme est le plus souvent utilisé pour générer des menus de navigation de style table des matières où les éléments de menu, à une certaine profondeur, doivent avoir la même apparence, qu'ils aient ou non des sous-menus.

Remarque
Si vous utilisez l'une des collections de styles de niveau répertoriées dans le tableau précédent pour définir le style du contrôle Menu, ces paramètres de style substituent les propriétés de style de l'élément de menu.

En plus de personnaliser le style d'un élément de menu, vous pouvez également personnaliser son apparence. Vous pouvez spécifier des images personnalisées pour les différentes parties d'un élément de menu en définissant les propriétés dans le tableau suivant.

Pour déterminer si un élément de menu est actuellement sélectionné dans un contrôle Menu, utilisez la propriété Selected. Vous pouvez également déterminer si un élément de menu est lié aux données en utilisant la propriété DataBound. Si un élément de menu est lié aux données, vous pouvez utiliser la propriété DataItem pour accéder aux valeurs de l'élément de données liées à l'élément de menu.

Pour obtenir la liste des valeurs initiales des propriétés d'une instance de la classe MenuItem, consultez le constructeur MenuItem.

L'exemple suivant indique comment remplir un contrôle Menu avec des objets MenuItem statiques à l'aide d'une syntaxe déclarative.

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >
  <head runat="server">
    <title>MenuItem Declarative Example</title>
</head>
<body>
    <form id="form1" runat="server">

      <h3>MenuItem Declarative Example</h3>

      <!-- Use declarative syntax to create the   -->
      <!-- menu structure. Create submenu items   -->
      <!-- by nesting them within parent menu     -->
      <!-- items.                                 -->
      <asp:menu id="NavigationMenu"
        staticdisplaylevels="1"
        staticsubmenuindent="10" 
        orientation="Vertical" 
        target="_blank"  
        runat="server">

        <items>
          <asp:menuitem navigateurl="Home.aspx" 
            text="Home"
            imageurl="Images\Home.gif"
            popoutimageurl="Images\Popout.jpg"   
            tooltip="Home">
            <asp:menuitem navigateurl="Music.aspx"
              text="Music"
              popoutimageurl="Images\Popout.jpg"
              tooltip="Music">
              <asp:menuitem navigateurl="Classical.aspx" 
                text="Classical"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Classical"/>
              <asp:menuitem navigateurl="Rock.aspx"
                text="Rock"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Rock"/>
              <asp:menuitem navigateurl="Jazz.aspx"
                text="Jazz"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Jazz"/>
            </asp:menuitem>
            <asp:menuitem navigateurl="Movies.aspx"
              text="Movies"
              popoutimageurl="Images\Popout.jpg"              
              tooltip="Movies">
              <asp:menuitem navigateurl="Action.aspx"
                text="Action"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Action"/>
              <asp:menuitem navigateurl="Drama.aspx"
                text="Drama"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Drama"/>
              <asp:menuitem navigateurl="Musical.aspx"
                text="Musical"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Musical"/>
            </asp:menuitem>
          </asp:menuitem>
        </items>

      </asp:menu>

    </form>
  </body>
</html>

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >
  <head runat="server">
    <title>MenuItem Declarative Example</title>
</head>
<body>
    <form id="form1" runat="server">

      <h3>MenuItem Declarative Example</h3>

      <!-- Use declarative syntax to create the   -->
      <!-- menu structure. Create submenu items   -->
      <!-- by nesting them within parent menu     -->
      <!-- items.                                 -->
      <asp:menu id="NavigationMenu"
        staticdisplaylevels="1"
        staticsubmenuindent="10" 
        orientation="Vertical" 
        target="_blank"  
        runat="server">

        <items>
          <asp:menuitem navigateurl="Home.aspx" 
            text="Home"
            imageurl="Images\Home.gif"
            popoutimageurl="Images\Popout.jpg"   
            tooltip="Home">
            <asp:menuitem navigateurl="Music.aspx"
              text="Music"
              popoutimageurl="Images\Popout.jpg"
              tooltip="Music">
              <asp:menuitem navigateurl="Classical.aspx" 
                text="Classical"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Classical"/>
              <asp:menuitem navigateurl="Rock.aspx"
                text="Rock"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Rock"/>
              <asp:menuitem navigateurl="Jazz.aspx"
                text="Jazz"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Jazz"/>
            </asp:menuitem>
            <asp:menuitem navigateurl="Movies.aspx"
              text="Movies"
              popoutimageurl="Images\Popout.jpg"              
              tooltip="Movies">
              <asp:menuitem navigateurl="Action.aspx"
                text="Action"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Action"/>
              <asp:menuitem navigateurl="Drama.aspx"
                text="Drama"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Drama"/>
              <asp:menuitem navigateurl="Musical.aspx"
                text="Musical"
                separatorimageurl="Images\Separator.jpg"
                tooltip="Musical"/>
            </asp:menuitem>
          </asp:menuitem>
        </items>

      </asp:menu>

    </form>
  </body>
</html>

L'exemple suivant indique comment lier un contrôle Menu à un contrôle SiteMapDataSource. Lorsqu'il est lié à une source de données, le contrôle Menu crée automatiquement les objets MenuItem. Pour que cet exemple fonctionne, vous devez copier les données du plan de site ci-dessous dans un fichier nommé Web.sitemap.

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >

  <!-- For the hover styles of the Menu control to  -->
  <!-- work correctly, you must include this head   -->
  <!-- element.                                     -->
  <head runat="server">
    <title>Menu DataBinding Example</title>
</head>

  <body>
    <form id="form1" runat="server">

      <h3>Menu DataBinding Example</h3>

      <!-- Bind the Menu control to a SiteMapDataSource control.  -->
      <asp:menu id="NavigationMenu"
        disappearafter="2000"
        staticdisplaylevels="2"
        staticsubmenuindent="10" 
        orientation="Vertical"
        font-names="Arial" 
        target="_blank"
        datasourceid="MenuSource"   
        runat="server">

        <staticmenuitemstyle backcolor="LightSteelBlue"
          forecolor="Black"/>
        <statichoverstyle backcolor="LightSkyBlue"/>
        <dynamicmenuitemstyle backcolor="Black"
          forecolor="Silver"/>
        <dynamichoverstyle backcolor="LightSkyBlue"
          forecolor="Black"/>

      </asp:menu>

      <asp:SiteMapDataSource id="MenuSource"
        runat="server"/>        

    </form>
  </body>
</html>

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html  >

  <!-- For the hover styles of the Menu control to  -->
  <!-- work correctly, you must include this head   -->
  <!-- element.                                     -->
  <head runat="server">
    <title>Menu DataBinding Example</title>
</head>

  <body>
    <form id="form1" runat="server">

      <h3>Menu DataBinding Example</h3>

      <!-- Bind the Menu control to a SiteMapDataSource control.  -->
      <asp:menu id="NavigationMenu"
        disappearafter="2000"
        staticdisplaylevels="2"
        staticsubmenuindent="10" 
        orientation="Vertical"
        font-names="Arial" 
        target="_blank"
        datasourceid="MenuSource"   
        runat="server">

        <staticmenuitemstyle backcolor="LightSteelBlue"
          forecolor="Black"/>
        <statichoverstyle backcolor="LightSkyBlue"/>
        <dynamicmenuitemstyle backcolor="Black"
          forecolor="Silver"/>
        <dynamichoverstyle backcolor="LightSkyBlue"
          forecolor="Black"/>

      </asp:menu>

      <asp:SiteMapDataSource id="MenuSource"
        runat="server"/>        

    </form>
  </body>
</html>

Ceci est un exemple de données de plan de site de l'exemple précédent.

<siteMap>

<siteMapNode url="~\Home.aspx"

title="Home"

description="Home">

<siteMapNode url="~\Music.aspx"

title="Music"

description="Music">

<siteMapNode url="~\Classical.aspx"

title="Classical"

description="Classical"/>

<siteMapNode url="~\Rock.aspx"

title="Rock"

description="Rock"/>

<siteMapNode url="~\Jazz.aspx"

title="Jazz"

description="Jazz"/>

</siteMapNode>

<siteMapNode url="~\Movies.aspx"

title="Movies"

description="Movies">

<siteMapNode url="~\Action.aspx"

title="Action"

description="Action"/>

<siteMapNode url="~\Drama.aspx"

title="Drama"

description="Drama"/>

<siteMapNode url="~\Musical.aspx"

title="Musical"

description="Musical"/>

</siteMapNode>

</siteMapNode>

</siteMap>

.NET Framework

Windows 7, Windows Vista SP1 ou ultérieur, Windows XP SP3, Windows XP SP2 Édition x64, Windows Server 2008 (installation minimale non prise en charge), Windows Server 2008 R2 (installation minimale prise en charge avec SP1 ou version ultérieure), Windows Server 2003 SP2

Référence