CSS Declarations

CollapsableMenu	Single Line Menu
Introduction Creating Menus in Python The WebPage Class The HiddenPage Class The WebMenu Class Using XML to define a Web Menu object Q&A CSS Declarations	WebMenu Documentation >> CSS Declarations
	QuickNavigationMenu	QuickParentNavigationMenu
	<<	<< ^
	MultiLineMenu
	Introduction \| Creating Menus in Python \| The WebPage Class \| The HiddenPage Class \| The WebMenu Class \| Using XML to define a Web Menu object \| Q&A \| CSS Declarations

WebMenu can automatically generate a lot of HTML that would be incredibly frustating to manually maintain across a site. It does leave a lot of the style to CSS. Here is a template of a css file that contains the basic declarations to render your menus the way you want.

To use this you will need to replace the generics with the specifics. Instead of 'menuTag' use whatever you are using as the default menu tag.

menuTag.menuClass { color: #000; background-color: #fff; }

menuTag.menuClass a.pageClass:link { color: #00f; }
menuTag.menuClass a.pageClass:active { color: #f00; }
menuTag.menuClass a.pageClass:visited { color: #0ff; }
menuTag.menuClass a.pageClass:hover { color: #0f0; }

menuTag.menuClass a.hereClass:link { color: #0ff; }
menuTag.menuClass a.hereClass:active { color: #ff0; }
menuTag.menuClass a.hereClass:visited { color: #0ff; }
menuTag.menuClass a.hereClass:hover { color: #f0f; }

If you have declared a linkclass that is different than the pageclass, then you will need to add:

menuTag.menuClass a.linkClass:link { color: #00f; }
menuTag.menuClass a.pageClass:active { color: #f00; }
menuTag.menuClass a.pageClass:visited { color: #0ff; }
menuTag.menuClass a.pageClass:hover { color: #0f0; }

There are also different styles used with quick navigation bars, so more styles:

menuTag.menuClass a.quickClass:link { color: #00f; }
menuTag.menuClass a.quickClass:active { color: #f00; }
menuTag.menuClass a.quickClass:visited { color: #0ff; }
menuTag.menuClass a.quickClass:hover { color: #0f0; }

And since collapsable menus can have as many styles as levels, theres more:

menuTag.menuClass a.mainClass:link { color: #00f; }
menuTag.menuClass a.mainClass:active { color: #f00; }
menuTag.menuClass a.mainClass:visited { color: #0ff; }
menuTag.menuClass a.mainClass:hover { color: #0f0; }

menuTag.menuClass a.sub1Class:link { color: #00f; }
menuTag.menuClass a.sub1Class:active { color: #f00; }
menuTag.menuClass a.sub1Class:visited { color: #0ff; }
menuTag.menuClass a.sub1Class:hover { color: #0f0; }