Fancify your links! Add some text decor!

Underlined hyperlinks are so 1995. Perhaps you’d like to jazz up your links and give your site some small touches that make it look cool or different? Well then, let’s get to it! This is mad easy.

Step 1 : Okay, so on your CSS stylesheet, if you don’t have a section for links already, you’re going to want to input the a:link, a:visited, a:hover, and a:active sections (see picture below).

NOTE: You don’t have to use all four. If you just want a hover effect, you’ll be fine with just a:hover.

Step 2: You can specify color (if you want), and then you can specify a text decoration. (You can use this with plain text too!) The different kinds of decoration are: underline, overline, line-through, blink, and inherit.

Once you’ve decided how you’d like your links to look (you can combine effects as well), you’re kind of done! How easy!!

Here’s an example of some hyperlinks I made using color and text decoration:

The hover-over effect for this example is “blink,” it makes the text disappear!

Humble helper,
Erin McGaw

~ by neonxbats on October 1, 2012.

%d bloggers like this: