开发者

Overriding parent CSS attribute

I have this CSS:

a:hover {
  background-color:#D1E1EA;
  color:#19558D;
  text-decoration:none;
}

for all links in my 开发者_如何学Capp. However, on one specific link I want to nullify all of this hover behavior. How can I do this?

Note that it's not as simple as redefining these attributes for the specific link, because the color of the specific link changes, and so I couldn't just choose one background-color...


I'm not completely sure what you mean by overwrite, but you can try setting the background color to transparent, so you're not specifying a specific colour.

a:hover.moreSpecific{
   background-color: transparent;
}


I previously posted a comment saying you couldn't do this, but there's a :not() selector in CSS 3 that could do this. It just won't work in IE < 9. I think you'd have to use JS to do it in IE.

a:hover:not(#specific_link) {
  background-color:#D1E1EA;
  color:#19558D;
  text-decoration:none;
}


Most (all?) CSS properties allow you to inherit from the parent element:

a:hover.special {
    background: transparent;
    color: inherit;
    text-decoration: inherit;
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜