By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
425,600 Members | 1,683 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 425,600 IT Pros & Developers. It's quick & easy.

a:hover in the style attribute of an anchor tag

P: n/a
Say I wanted to make a link change colors when someone was hovering
over it. Ordinarily, I could do that by doing something like...

<style>
a {
color: whatever;
}

a:hover {
color:whatever;
}
</style>

Say, however, I wanted to alter the CSS via the style attribute. eg.

<a href="" style="">

How would I make it change colors when someone was hovering over it?

Oct 9 '07 #1
Share this Question
Share on Google+
4 Replies


P: n/a
yawnmoth wrote:
Say, however, I wanted to alter the CSS via the style attribute. eg.

<a href="" style="">

How would I make it change colors when someone was hovering over it?
Specify an `!important' property:
a:hover {
color: whatever !important;
}
--
Beware of bugs in the above code; I have only proved it correct, not
tried it. -- Donald E. Knuth
Oct 9 '07 #2

P: n/a
yawnmoth wrote:
Say I wanted to make a link change colors when someone was hovering
over it. Ordinarily, I could do that by doing something like...

<style>
a {
color: whatever;
}

a:hover {
color:whatever;
}
</style>

Say, however, I wanted to alter the CSS via the style attribute. eg.

<a href="" style="">

How would I make it change colors when someone was hovering over it?
yawnmoth,

I believe the answer is, "You wouldn't".

See http://www.w3.org/TR/html401/present....html#h-14.2.3 and go
down several lines to:

"Some style sheet implementations may allow a wider variety of rules in
the STYLE element than in the style attribute. For example, with CSS,
rules may be declared within a STYLE element for:

* All instances of a specific HTML element (e.g., all P elements,
all H1 elements, etc.)
* All instances of an HTML element belonging to a specific class
(i.e., whose class attribute is set to some value).
* Single instances of an HTML element (i.e., whose id attribute is
set to some value)."

To which you could add a fourth example:
* Pseudo elements and classes.
(you could also clarify the paragraph by saying, "...rules may be
declared within the STYLE element, but not in the STYLE attribute, for:")

So what if you are building or modifying the page dynamically? How
could you create this effect?

I see two possible ways, neither of which I can personally vouch for:
Assign a class or ID as appropriate to the link, then
1. add appropriate style lines to a <styleelement in the <head>
of the page or
2. modify the stylesheet directly using the DOM interface

Chris Beall

Oct 9 '07 #3

P: n/a
In article <6wBOi.3848$h33.3493@trndny02>,
Joshua Cranmer <Pi*******@verizon.netwrote:
yawnmoth wrote:
Say, however, I wanted to alter the CSS via the style attribute. eg.

<a href="" style="">

How would I make it change colors when someone was hovering over it?

Specify an `!important' property:
a:hover {
color: whatever !important;
}
Try it, it does not work any more than a:hover {
color: whatever;} as an inline style.

The way to do it tactically (presumably that is what the OP is
asking), is to class the a and in the head or in the external css
sheet put in the normal code.

<a class="nextPageLink" href="...">Next page</a>

and in the css elsewhere or above in the head:

a:hover.nextPageLink {color: red; background: ...;}

Or if this is too wild looking, class element it sits in.

<p class="nextPageSpiel"><a href="...">Next page</a></p>

and in the css elsewhere or above in the head:

..nextPageSpiel a:hover {color: red; background: ...;}

--
dorayme
Oct 9 '07 #4

P: n/a
Scripsit yawnmoth:
Say I wanted to make a link change colors when someone was hovering
over it. Ordinarily, I could do that by doing something like...

<style>
a {
color: whatever;
}
Wrong. Don't proceed to any more complicated issues before you have
understood and taken care of these:
1) Use valid HTML.
2) Always set background when setting color.
3) Don't destroy the vital distinction between visited and unvisited links.
4) Remember that not all <aelements are links.
5) You seldom have a right idea of setting link colors as different from
browser defaults when you missed items 1 thru 4.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Oct 9 '07 #5

This discussion thread is closed

Replies have been disabled for this discussion.