In this
article I plan to write about Menu Control. By using Web user Control we can
design Menu Control, and then we added the menu control to the main page. By
following this method we can use same menu control for all pages. No need to
create Menu for each page.
Firstly you added one web user control (menu.ascx) and style
Sheet (menu3.css) this item is available in solution Explorer. Then enter the
following CSS Code in the style Sheet file.
.Menu
{
background:transparent url(images/blueslate_background.gif) repeat-x;
text-align:center;
font-size:11px;
border: solid 1px #fff !important;
}
.menuhover
{
color:#fff;background:transparent url(images/blueslate_backgroundOVER.gif) no-repeat topcenter;
}
And Create images folder in solution explorer and copy the below pictures in that folder. 
Copy the below code in menu.ascx page…
<link rel="stylesheet"
href="Menu3.css"
type="text/css"
/>
<div id="header"
align="center"
>
<table width="100%"
cellpadding ="0"
cellspacing ="0"
align="center">
<tr>
<td align="center">
<asp:Menu ID="Menu1" runat="server" Orientation
="Horizontal" CssClass ="Menu" Font-Names="Verdana"
ForeColor ="White"
Width="800px">
<StaticMenuItemStyle Height
="40px"/>
<DynamicMenuItemStyle CssClass
="Menu" Height="40px" HorizontalPadding="25px"
/>
<dynamichoverstyle
CssClass ="menuhover"
/>
<StaticHoverStyle CssClass
="menuhover" />
<Items>
<asp:MenuItem Text="My Menu">
<asp:MenuItem Text ="My profile" Enabled
="true" ></asp:MenuItem>
<asp:MenuItem Text="my Forum" Enabled
="true"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="Classfields" >
<asp:MenuItem Text="car" Enabled
="true" ></asp:MenuItem>
<asp:MenuItem Text="Item For sale" Enabled
="true" ></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="Forum">
<asp:MenuItem Text="Create a Forum">
</asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="Answers">
<asp:MenuItem Text="post Answer">
<asp:MenuItem Text="Ask Question"></asp:MenuItem>
<asp:MenuItem Text="FAQ"></asp:MenuItem>
</asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="Guide">
<asp:MenuItem Text="Contact us"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text ="Help" >
<asp:MenuItem Text="About Us" Enabled
="true"></asp:MenuItem>
</asp:MenuItem>
</Items>
</asp:Menu>
</td>
</tr>
</table>
</div>
IN Default.aspx page create a table
in following td drag the menu control in your td,Your code will look like below..
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled
Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table cellpadding ="0" cellspacing
="0" width
="1000" align="center" >
<tr>
<td>
<uc1:menu ID="menu1" runat="server" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
Hope this article was useful. Do let me know your feedback. You can download the demo app from the above attachment link.
Thanks