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 frames using CSS3 border-image
CSS3 makes it possible to specify an image as an element's border, instead of just a solid color. It takes a single image and then slices and dices it before using the end pieces to make up the border. Very cool!
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,
CSS Triangle Arrow DIVs
A look at how to use CSS to produce triangles/ arrows without any image. Using this technique, 4 speech bubble style DIVs can be created using markup only.
CSS3 Text Shadows
CSS3 throws its full weight behind text shadows, which as the name suggests, lets you add shadows to regular text on the page. And with support for multiple shadows simultaneously applied to the same text, CSS text shadows can produce some stunning textual effects without images.
CSS Circle Menu
This CSS example uses CSS3's
border-radius property that's set to a very large value to create circle menu links.
CSS3 Gradient Menu Buttons
These fancy looking buttons brings together CSS3's
box-shadow, and linear gradients to create glossy looking menu buttons that use NO images.
CSS3 Hover Image Gallery
A sleek image gallery that takes advantage of CSS3 animation, shadows, and the "
transform" property to instantly add a smooth hover effect to its images, whereby the image enlarges and moves closer to the user.