Is there a way to change css on hover with (style="")? [duplicate]

Question

I know you can import a css file that contains, let's say:

div {
    color: black; 
}

div:hover {
    color: red;
}

but is there a way to get the same effect but in the html?

So something with

<div style="color: black;"></div>

I KNOW you can do it with js, but I just wanted to know if there were a hack for it.. And no the "duplicate" question did not contain the answer I was looking for, keep in mind that was 4 years ago.

There was no answer there... this is 4 years later and it might be able now we have html5 and css3 — user_2215528
– user_2215528, Commented Jul 31, 2013 at 8:33
@OussamaDooby +1 for the thought, but researching a little bit would have helped to not open another duplicate question. — Markus Hofmann
– Markus Hofmann, Commented Jul 31, 2013 at 8:37
There just might be someone out(here/there) who has a little hack for it... We all know css is FULL of hacks — user_2215528
– user_2215528, Commented Jul 31, 2013 at 9:11

Mr. Alien · Accepted Answer · 2013-07-31 08:31:36Z

3

Pseudo classes are not allowed to use as inline CSS, so the short answer is NO, you cannot do what you are trying to achieve.

Consider using <style> tags at document level, or you can use JavaScript if you want to..

<a href="#" onmouseover = "this.style.color = '#000'" 
            onmouseout  = "this.style.color = '#f00'">Hi</a>

Demo

And as you commented, still the answer is no, even using HTML5/CSS3 there's no way you can use pseudo classes inline.

answered Jul 31, 2013 at 8:31

Mr. Alien

158k36 gold badges307 silver badges287 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Levi Govaerts · Accepted Answer · 2013-07-31 08:35:23Z

2

<div onmouseover="this.style.color='black'">I wouldn't suggest this</div>

answered Jul 31, 2013 at 8:35

Levi Govaerts

212 bronze badges

Comments

Aldi Unanto · Accepted Answer · 2013-07-31 08:34:38Z

1

There is no way as far I know. But you can still realize it with js.

<div
   onmouseover="this.style.color='#ff0000'"
   onmouseout="this.style.color='#000000'">
</div>

answered Jul 31, 2013 at 8:34

Aldi Unanto

3,6821 gold badge25 silver badges31 bronze badges

Comments

Bernardao · Accepted Answer · 2013-07-31 08:34:03Z

0

Have you tried this?

<div style=":hover {color: red}">Testing inline hover</div>

answered Jul 31, 2013 at 8:34

Bernardao

5007 silver badges25 bronze badges

5 Comments

Aldi Unanto Over a year ago

Write on comment please

Bernardao Over a year ago

<div style=":hover {color: red}">Testing inline hover</div>

Mr. Alien Over a year ago

@AldiUnanto I don't think he has commenting rights

Bernardao Over a year ago

Don't understand the -1 I was refering to the link provided in the first answer. That possibility appear ins W3C w3.org/TR/2002/WD-css-style-attr-20020515 It doesn't work on browsers but it's there

Bernardao Over a year ago

The same answer I gave was given in the original question and got 7 positive votes. stackoverflow.com/questions/1033156/… In the questions says he knows it can be done with js, and the solutions given are in javascript...

Collectives™ on Stack Overflow

Is there a way to change css on hover with (style="")? [duplicate]

4 Answers 4

Comments

Comments

Comments

5 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

5 Comments

Linked

Related