Mega Code Archive
Menu with CSS style
<![CDATA[
<%@ Page Language="C#"%>
<!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" xml:lang="en">
<head id="Head1" runat="server">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Styling a Menu</title>
<style type="text/css" rel="stylesheet">
#logo {
float: left;
width: 10.5em;
background: #CCCCCC;
padding: 0.5em 0.5em 0.5em 1em;
margin: 0;
}
.primaryStaticMenu
{
background-color: transparent;
float: right;
}
.primaryStaticMenuItem
{
width: 10em;
background-color: #f7f2ea;
border-width: 1px;
border-color: #efefef #aaab9c #ccc #efefef;
border-style: solid;
color: #777777;
padding: 0.5em 0 0.5em 1em;
}
.primaryStaticHover
{
color: #800000;
background: #f0e7d7;
}
.primaryDynamicMenu
{
background-color: #f7f2ea;
border-bottom: solid 1px #ccc;
}
.primaryDynamicMenuItem
{
width: 10em;
background-color: #f7f2ea;
color: #777;
padding: 0.5em 0 0.5em 1em;
border-width: 1px;
border-color: #f7f2ea #aaab9c #f7f2ea #efefef;
border-style: solid;
}
.primaryDynamicHover
{
color: #800000;
background: #f0e7d7;
}
.secondaryLevelOne
{
background-color: transparent;
background-repeat: repeat-x;
margin: 1.5em 0 0 0;
padding: 5px 0 0 5px;
width: 12em;
height: 35px;
}
.secondaryLevelTwo
{
background: #FAFBFB;
padding: 5px 0 5px 5px;
}
.secondaryStaticHover
{
color: #800000;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="container">
<asp:Menu id="menuPrimary"
runat="server"
DataSourceID="siteSource1"
Orientation="Horizontal"
StaticEnableDefaultPopOutImage="false"
StaticDisplayLevels="1"
MaximumDynamicDisplayLevels="1">
<StaticMenuStyle CssClass="primaryStaticMenu"/>
<StaticMenuItemStyle CssClass="primaryStaticMenuItem"/>
<StaticHoverStyle CssClass="primaryStaticHover"/>
<DynamicMenuStyle CssClass="primaryDynamicMenu" />
<DynamicMenuItemStyle CssClass="primaryDynamicMenuItem"/>
<DynamicHoverStyle CssClass="primaryDynamicHover"/>
</asp:Menu>
<asp:SiteMapDataSource ID="siteSource1" runat="server"
ShowStartingNode="false" />
</div>
</form>
</body>
</html>
File: Web.sitemap
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode title="Home" description="Home Page" url="Default.aspx">
<siteMapNode title="News" description="The Latest News" url="News.aspx">
<siteMapNode title="U.S." description="U.S. News" url="News.aspx?cat=us" />
<siteMapNode title="World" description="World News" url="News.aspx?cat=world" />
<siteMapNode title="Technology" description="Technology News" url="News.aspx?cat=tech" />
<siteMapNode title="Sports" description="Sports News" url="News.aspx?cat=sport" />
</siteMapNode>
<siteMapNode title="Weather" description="The Latest Weather" url="Weather.aspx" />
</siteMapNode>
</siteMap>
]]>