CSS Library Horizontal CSS Menus
Welcome to Dynamic Drive's new CSS library! Here you'll find original, practical CSS codes and examples such as CSS menus to give your site a visual boast.
Page 1 of 7 pages 1 2 3 > Last »
Animated horizontal tabs
These sliding doors based blue tinted tabs "jump up" when selected, such as when the mouse rolls over each one. This is accomplished using a combination of relative positioning and padding on each tab. The result are tabs that animate without any scripting.
Bevel horizontal Menu
This CSS code creates a "3 state" horizontal menu out of an ordinary list. When the mouse moves over the menu, the menu item bevels up, and in modern browsers, depressing on the menu also creates a depressed state.
CF Navigation Menu
This is CSS based navigational menu based on a single tab interface. Four images are used as part of its interface- the two round corners, an indented divider between menu links, and a gradient background image spanning the menu.
CF Navigation Menu II
This is an inverted version of the original CF Navigation Menu. Four images are used as part of its interface- the two round corners, an indented divider between menu links, and a gradient background image spanning the menu.
Chrome Menu Bar
This is a lightweight "chrome" looking CSS menu bar. The menu uses two variants of the same background image to create the hover effect, and each menu items can easily be set to either align "left", "center", or "right" on the page, just by changing the "text-align" attribute.
Clean Arrow Underline Menu
This menu uses the nifty "CSS Triangles technique" to create a clean horizontal UL menu with a thick arrow border applied to the currently active menu item. It uses no images nor any extranous markup to accomplish the effect,
Corp Blue CSS Menu
This corporate blue themed menu uses the sliding door technique to create 2 states. While it works perfectly fine against a white background, for black background pages, the tabs reveal a thick white outline around its edges.








