无法设置一个uninherited属性元素

Question

我有这一套样式元素：

#gallery > div > a { 
    width: 100%; 
    display: block; 
    font-size: 0.85em; 
    color: rgb(0, 118, 209); 
    text-align: left; 
    font-weight: bold; 
    font-family: sans-serif; 
    text-decoration: initial; 
    position: absolute; 
    top: -14px; 

，我需要它有下划线时，悬停到hightlight，所以我这样做：

div[class^="pic"] > img:hover > a { 
    text-decoration: underline; 
} 

但它不起作用。我试图使用！重要的，但它也没有结果。

对不起是我的错，那就是：

<div id="gallery"> 
     <div class="pic1"> 
     <img src="./img/1.jpg"><a href="#">... 
     </img> 
     </div> 
     <div class="pic2"> 
     <a href="#">...</a> 
     <img src="./img/2.jpg"> 
     <p>...</p> 
     </div> 
     <div class="pic3"> 
     <a href="#">...</a> 
     <img src="./img/3.jpg"> 
     <p>...</p> 
     </div> 
     <div class="pic4"> 
     <a href="#">...</a> 
     <img src="./img/4.jpg"> 
     <p>...</p> 
     </div> 
    </div> 

Answer 1

假设这种结构（最初提供）

<div id="gallery"> 
     <div class="pic1"> 
     <img src="./img/1.jpg"><a href="#"></a> 
      <p></p> 
     </img> 
     </div> 
</div 

你的选择应该是

div[class^="pic"] > img:hover + a { 
    text-decoration: underline; 
} 

上选择一个有用的文章：http://code.tutsplus.com/tutorials/the-30-css-selectors-you-must-memorize--net-16048