懸停不起作用<a href> tag

Question

I'm fairly new to HTML/CSS so excuse me if this is a simple question but my a:hover (using an id and not a class) isn't working inside an a href tag but when I use it in a th tag it does.

HTML

<a href='http://www.example.com' id='link1'>Example Text</a> 

CSS

#link1 a:hover { 
text-decoration: none; 
color: #E0E0E0; 
} 

The thing is that if I put it in a div and set it as a class instead of an id, it works but then moves the rest of the links afterward down a line on the page.

Answer 1

這是因爲您試圖在id'link1'內找到錨鏈接，而link1是錨鏈接。試試這個：

a#link1:hover { 
    text-decoration: none; 
    color: #E0E0E0; 
} 

http://jsfiddle.net/kF8ey/

Answer 2

Your selector is incorrect. Try this:

#link1:hover { 
    text-decoration: none; 
    color: #E0E0E0; 
} 

By using: #link1 a:hover, your telling your code too look for a link named #link1 and then look for an anchor tag inside of it. Clearly you just want #link1 itself.

Soultion in a fiddle: http://jsfiddle.net/9GXg8/