INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Jobs

Hover Effect

How do I create a Hover Effect on links? by cian
Posted: 18 Jan 02

Adding a hover effect to your links with CSS


Where normally you specify the colour of links in the body of a HTML document with


<body link="color" vlink="color" alink="color">


Now you can add another effect called hover. Basically when you "mouse over" the link
you can get the link background, color, size, font, underline etc to change.

This is done by adding the following code to the <HEAD> section of your document:


<HEAD>

<style type="text/css">
<!--
a:link {color:#000000 ; text-decoration: none; }
a:active {color: #000033; text-decoration: none; }
a:visited {color: #000066; text-decoration: none; }
a:hover {color: #003300; text-decoration: underline; }
-->
</style>

</HEAD>



Example Notes:
Color: You can substitute the colours above with whatever colour you want.
Text-decoration: This is usually underline, overline, line-through, blink or none.

You can also add to that any number of stylings such as

{ font-family: verdana; font-weight: bold; font-size: 12pt; background-color: #123456 }

and so on...but thats another story...

Hover effects 2 will cover having a number of different hover effects in one document.

I apologise for any errors or ommisions.
Questions or feedback would be greatly appreciated.

+

Back to HTML, XHTML & CSS FAQ Index
Back to HTML, XHTML & CSS Forum

My Archive

Resources

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close