CSS Library All examples
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.
Image Marker Menu
This CSS code creates a vertical menu out of ordinary lists, using an arrow image to replace the default HTML marker. The image is applied as a background image, with a different one shown when the mouse moves over the links.
Shade Image Tabs Menu
This is an attractive "blue shading" image tab menu that supports tabs alignment. The shade effect is created using two gradient background images.
Breadcrumbs is a term used to describe hierarchical links that tell the visitor where he/she currently is on your site. This CSS code transforms ordinary looking links into a breadcrumb by giving each link a background image.
Arrow Comment Box
Using an "arrow" image, this CSS code transforms a regular DIV into a fancy "bubble" container . It's a nice interface to use for your blog's comment boxes, for example.
DD Color Tabs
This is a lightweight, very easy to customize image tabs menu similar to the one you see throughout Dynamic Drive. Instead of swapping between two tab images, this menu uses a single transparent tab instead. What this means is that you can in fact change the menu and menu hover colors just by changing the two color values inside the CSS code! It doesn't get simpler than that.
CSS Popup Image Viewer
Enable arbitrary links or image thumbnails to pop up an enlarged (different) image onMouseover by using this CSS code. With the help of CSS's ":hover" pseudo class, combined with relative and absolute positioning, the enlarged images are simply included on the page as normal HTML, "popping" up on demand.
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.