Wednesday, November 17, 2010

Quick CSS Trick: Using Span to Break Up Words in URLS

How about breaking up the words in the URL with color? Check it out:

I think that works pretty well, and it is something that can be achieved very easily with a little CSS:

a span { color: #971212; }

Then in your anchor link in your HTML just wrap the word you want colored in a span like so:

To extend this concept a bit, how about the colors reverse themselves upon rollover? Like so:

Just do this in your CSS:

a { color: black;}
a span { color: #971212; }
a:hover { color: #971212; }
a:hover span { color: black; }

Source at :