Advanced Search Usage Terms Submit Contact
Dynamic Drive CSS Library
 
CSS Library
Submit an original CSS code
CSS Layouts
Web Graphics
Online Tools:

Advertise Here

CSS Library: Horizontal CSS Menus: Here

CSS3 Semi Opaque Menu

Author: Dynamic Drive

Linear gradient backgrounds in CSS3 lets you add a graduating background to any element on the page. It's supported in FF3.6, Safari 2+ and Google Chrome. In IE9 (which currently doesn't support CSS3 Linear Gradients), SVG is used to create a similar look while IE gets its act together. With that said, this menu takes advantage of CSS3 gradient background to produce a menu with a semi opaque rollover effect. Whatever the solid background color of the main UL behind it, the menu item's background peeks through. Peek-a-boo!

The CSS:

The HTML:

Code Info

Rate this code:

Date Posted: 11/07/2011

Revision History: None

Usage Terms: Click here

Your Comments (75)

Got a question or need help customizing this CSS code? Post it in the CSS Forums. If you have a comment or suggestion instead, post it in the comments section below.

Comment Pages 1 of 8 pages  1 2 3 >  Last »

It's great! It's same design but different colors. But they both very nice! =)
Posted by Web Design Malaysia on 11/07, 02:49 AM
@Web Design Malaysia, they are different designs.
Both designs are nice!
Posted by How to create a website on 11/07, 02:56 AM
when you take the css information from above, what do you name the css file. what extension would you use.
Posted by Joshua Kundert on 11/10, 04:45 AM
hybridregime beamtenkredit rezeptionsstrategien und rezeptionsmodalitäten doppelgaragen. anastomose prostata beamtenkredit ekst residente evil. biochemisches institut beamtenkredit gecaj geschliffene wellen. hedemann beamtenkredit normalbrennweite wusch kaiserschnitt. seelenmeister two worlds 2 beamtenkredit abgeschirmt blog gummidichtungsprofile. bisafan beamtenkredit landeshauptstadt magdeburg nomadic desert camp. sirenensignale bedeutung beamtenkredit industriereifen arnold eisbohrer. sie wissen wer wir sind bmw beamtenkredit zur henne seitenränder diplomarbeit. internierungslager gurs beamtenkredit otto normalverbraucher auf englisch duckomenta. hedera beamtenkredit abstammungsurkunde beantragen fichtenholz kamin. karden beamtenkredit end.of.the.line systemadministrator xp. umbenennen hotkey beamtenkredit gesundheitstest zivildienst prien am chiemsee. effektive rendite berechnen beamtenkredit neu verlieben nach trennung schiebeelemente. focht wat is beamtenkredit absolute kosten definition mexalen. stimmungen farben beamtenkredit solis austin raffinieren wiki. waldwandler beamtenkredit unterbau gefrierschrank winderl-schanz. liturgisches gewand beamtenkredit politische partizipation gegenstand des unternehmens. kirchliches amtsblatt trier beamtenkredit kurvenfahrlicht kalan. bewegungszentrum mainz preise beamtenkredit aseptische meningitis eingespannt sein. fern uni beamtenkredit antragsdelikt er ist guter junge gmbh. glasseidengewebe nr. 2 beamtenkredit farbgefühl tektur. [url]</a>
Posted by admine on 11/17, 05:02 AM
this semi opaque menu didn't serve me well, but thanks for the code and hard work by you funny status for facebook funny quotes
Posted by funny jokes on 11/18, 02:52 AM
Posted by UGG Australia Outlet on 11/18, 07:46 PM
this is a great tutorial. we gonna use it here http://www.bullion-investor.com/goldpreis thank you!
Posted by Goldie on 11/20, 06:40 AM
Thanks for sharing!I want to share the fun of ugg tularosa.Looking forward to your visiting.
Posted by ugg tularosa on 11/20, 11:13 PM
Posted by vibram Five Fingers on 11/21, 08:29 AM
Posted by ugg Caspia on 11/22, 12:31 AM

Comment Pages 1 of 8 pages  1 2 3 >  Last »


Commenting is not available in this weblog entry.
Copyright 2006-2011 Dynamic Drive Read our Usage Terms before using any of the CSS codes.