Inline CSS for anchor tag and hover_问答_开发者

开发者 https://www.devze.com 2023-03-28 00:55 出处：网络

I\'m under the impression that changing an anchor tag on hover can 开发者_如何学编程be done like this:

相关专题：css

I'm under the impression that changing an anchor tag on hover can 开发者_如何学编程be done like this:

a:hover {background: #FFDD00;}
a:hover {color: #AAAAAA;}

Correct me if I'm wrong.

Now, for some convoluted reason, I can't put that code in a style sheet, I have to put it in the actual HTML. How would I do that?

<a href="..." style="___???___">...</a>

There's no way to do that.

Inline CSS can't touch pseudo-classes such as :hover.

I'm guessing the reason you want to do this is because you can only edit the <body> of the HTML (for whatever reason). What you can do is add a style element:

<style>
a:hover {
    background: #FFDD00;
    color: #AAAAAA;
}
</style>

<a href="#">...</a>

Having a style element outside the <head> is not valid HTML, but (crucially) it does work in all browsers.

If you can't toss your hover CSS into a tag, then the best way to handle this is going to be JavaScript. I wouldn't ordinarily call this a good approach, but it sounds like your hands are tied here.

<a href="..."
   onmouseover="this.style.backgroundColor='#ffdd00';this.style.color='#aaaaaa'"
   onmouseout="this.style.backgroundColor='transparent';this.style.color='inherit'">
...
</a>

Hope that works for you!

Found this in an old forum and it seems to work great :)

<a href="###" style="text-decoration: none;" onmouseover="this.style.textDecoration = 'underline'" onmouseout="this.style.textDecoration = 'none'">###</a>

You can put both styles in the same block, like this.

a:hover {
    background: #FFDD00;
    color: #AAAAAA;
}

And if you cannot use an external stylesheet, you can add a style block to the head of your page...

    ...
    <style>
        a:hover {
            background: #FFDD00;
            color: #AAAAAA;
        }
    </style>
</head>
...

I'm pretty sure you can't apply psudo-classes inline, but you can do this with javascript inline.

e.g.

<a href="..." onmouseover="this.style.color = 'red'" onmouseout="this.style.color = 'black'">...</a>

It would be better to follow the suggestions put forth above in an external style sheet, but for whatever reason you really need to do it, try this:

a href="" style="text-decoration:underline;color:blue;"

Inline CSS for anchor tag and hover

精彩评论

关注公众号

热门标签

图文推荐

Inline CSS for anchor tag and hover

更多 问答 相关资讯：

精彩评论

关注公众号

热门标签

图文推荐

更多问答相关资讯：