Hyperlink Rollover Effect



I am trying to set up a hyperlink rollover effect as follows:

hyperlink text - NOT underlined
mouseover - underlined

No color, font or other changes are necessary. I need to make it work the
same in IE, FireFox and Netscape. So far I have done this for IE using the
clumsy Front Page coding, but the latter two refuse to show underline
hyperlink effect when mouse is placed over the hyperlink

The trouble is when using "text-decoration: none" it kills the underline
altogether - both for inactive and mouseover hyperlink. If not using
"text-decoration: none" the hyperlink is underlined all the time - when
inactive and with mouse over it.

Does anybody know how this can be done?

Thank you very much!



Steve Easton

You need to use css and define the different states for the links in the following order:

a.link {
text-decoration: none;
a:visited {
text-decoration: none;
text-decoration: none;
a:hover {
text-decoration: underline;

Steve Easton
Microsoft MVP FrontPage
This site is best viewed............
........................with a computer

Andrew Murray

you can do this with styles. eg


a:link { font-size: 10pt; color: #5766AE; font-family:Arial;
font-weight:bold; text-decoration:underline }
a:hover { font-size: 10pt; color: #FF0000; font-family:Arial;
font-weight:bold; text-decoration: none }

Put this in the <head> of your page, or for an external stylesheet file,
start a new page, copy/paste the above, save the file as whatever.css. Then
in FP go to Format > Stylesheet links and choose the style sheet you
created to insert in your page(s).

Andrew Murray

apply "text-underline: none" to the specific attribute using styles. (See
my other post).
using the a: hover and a: active attributes.


Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads