Mouseover links code generator
Frequently asked questions
What's the difference between "hover" and "active" link states?
"Hover" applies while the mouse is resting over the link, before it's clicked. "Active" applies only for the brief moment the mouse button is actually held down on the link. Most sites only bother styling hover, but active can add a nice "pressed" feel.
Why does my browser show visited links differently even without this code?
Browsers apply a default visited-link colour (usually purple) automatically, based on your browsing history. This tool lets you override that with your own colour and styling so visited links match your site's design instead.
Should CSS go in the page head or an external stylesheet?
An external stylesheet is better if you're styling links the same way across many pages - it's cached by the browser and easier to maintain in one place. Head-of-page CSS is fine for a one-off page or when you can't edit a shared stylesheet.
Can I style just the links inside one part of my page?
Yes - choose "Apply to all links within a certain container" and enter that container's CSS class or ID (e.g. #footer or .sidebar-nav). Only links inside that element will get the new styling; every other link on the page is left alone.