Change href color on hover?

[Ken Williams]

Hi, I just want to change the color when I mouseover an href without a
style sheet. This does not work:

<a href="test.html" style="a:hover { color: #DA8525; }">Test</a>

Is that suppose to work?

 

[richard]

Hi, I just want to change the color when I mouseover an href without a
style sheet. This does not work:

<a href="test.html" style="a:hover { color: #DA8525; }">Test</a>

Is that suppose to work?

You'd be better off giving the tag a class or ID name then using the
a:hover there. AFAIK, the {} are not allowed in the inline method.

 

[dorayme]

You'd be better off giving the tag a class or ID name then using the
a:hover there. AFAIK, the {} are not allowed in the inline method.

OP might be better off classing. But not necessarily.

If he did class, btw, it would not be the tag but the element,
tags are not the sorts of things that can be classed.

The {} in themselves are parked legally, but the parking officer
would give a ticket for the vehicle as a whole - in particular,
noticing the a:hover. Can't have this inline!

So, either

1. If you wanted all anchors on your website to hover red, don't
class, just

a:hover {color: red;}

in an external style sheet linked to in the head of the document
like

<link rel="stylesheet" type="text/css" href="styles.css">

or in an embedded stylesheet in the head itself, like

<style type="text/css" media="screen">
....
a:hover {color: red};
....
</style>

2. Class the anchor, especially if it is a *one-off*:

<a class="name" href="test.html">Test</a>

with

a.name:hover {color: red;}

3. Class one or other of the anchor's containing elements - in
HTML 4.01 Strict, there needs to be at least one containing
element under body. For example, if you want all links in a
navigational list to hover red, you might target the anchors in
that particular list of a class "nav":

<ul class="nav">
<li><a href="home.html">home</a></li>
....
<li><a href="siteMap.html">site map</a></li>
....
</ul>

with

..nav a:hover {color:red;}

4. Don't class at all but simply target the anchors you want in
your external or embedded stylesheet. More often than not, in a
website, there are larger than one-off motives. For example, you
might very well want all links in a navigational unordered list
to be without underlining or to hover green or you might want all
the links in paragraphs to hover red. Take the latter case. No
need to class anything: it can be achieved by targeting in the
CSS with such as

p a:hover {
....
color: red;
....
}

 

[Helpful person]

So, either

1. If you wanted all anchors on your website to hover red, don't
class, just

a:hover {color: red;}

in an external style sheet linked to in the head of the document
like

<link rel="stylesheet" type="text/css" href="styles.css">

or in an embedded stylesheet in the head itself, like

<style type="text/css" media="screen">
...
a:hover {color: red};
...
</style>

2. Class the anchor, especially if it is a *one-off*:

<a class="name" href="test.html">Test</a>

with

a.name:hover {color: red;}

3. Class one or other of the anchor's containing elements - in
HTML 4.01 Strict, there needs to be at least one containing
element under body. For example, if you want all links in a
navigational list to hover red, you might target the anchors in
that particular list of a class "nav":

<ul class="nav">
<li><a href="home.html">home</a></li>
...
<li><a href="siteMap.html">site map</a></li>
...
</ul>

with

.nav a:hover {color:red;}

4. Don't class at all but simply target the anchors you want in
your external or embedded stylesheet. More often than not, in a
website, there are larger than one-off motives. For example, you
might very well want all links in a navigational unordered list
to be without underlining or to hover green or you might want all
the links in paragraphs to hover red. Take the latter case. No
need to class anything: it can be achieved by targeting in the
CSS with such as

p a:hover {
...
color: red;
...

}

Thanks very much for the explanation. I've always been very confused
about how to style links.

Richard Fisher