無法設置一個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