イメージに不透明度があり、divに関数を置く方法

Question

親から継承した不透明度を持たない次の画像を表示しようとしています。関連するコード：

CSS

 #accordion ul { 

     width:184px; 
     display:none; 
     margin:0px 0px 0px 0px; 
     padding:0px 0px 0px 0px; 
     opacity:0.70; 
     list-style-type: none; 
    } 

     #accordion ul li { 

      width:184px; 
      height:40px; 
      margin:0px 0px 0px 0px; 
      padding:0px 0px 0px 0px; 
      font-size:17px; 
      color:#999999; 
      background:url(img/green.png) no-repeat 8% 50%, url(img/back_line.png) ; 


     } 

     /* styling of submenu item */ 
     #accordion ul li img { 

      padding: 7px 8px 0px 35px ; 
      width:30px; 
      height:30px; 

     } 

     #accordion ul li:hover{ 
      width:184px; 
      height:40px; 
      background:url(img/green.png) no-repeat 8% 50%,#D5D5D2; 
     } 

     /* remove border bottom of the last item */ 
     #accordion ul li.last { 
      border-bottom: none; 
     } 

HTML

<ul id="accordion"> 
    <li> 
     <a href="#" class="item popular" rel="popular"></a> 
     <ul id="inchat" class="list_friends">   
      <div><img src="facebook/49992_720384020_1896998575_q.jpg">Francois</div> 
      <div><img src="facebook/48983_615523712_8495_q.jpg">Yue</div> 
      <div><img src="facebook/41621_717814907_4472_q.jpg">Daivid</div> 
     </ul> 
    </li> 
    <li> 
     <a href="#" class="item category" rel="category"></a> 
     <ul id="inchannel"> 

      <div><img src="facebook/49992_720384020_1896998575_q.jpg">Francois</div> 
      <div><img src="facebook/48983_615523712_8495_q.jpg">Yue</div> 
      <div><img src="facebook/41621_717814907_4472_q.jpg">Daivid</div> 
     </ul> 
    </li> 
    <li> 
     <a href="#" class="item comment" rel="comment"></a> 
     <ul id="online"> 
      <div><img src="facebook/49992_720384020_1896998575_q.jpg">Francois</div> 
      <div><img src="facebook/48983_615523712_8495_q.jpg">Yue</div> 
      <div><img src="facebook/41621_717814907_4472_q.jpg">Daivid</div> 
     </ul> 
    </li> 
</ul> 

画像は私が望んでいない親からの不透明度を持っています。また、hoverスタイルをdivに配置するにはどうすればよいですか？

ありがとうございます。

Answer 1

これは、あなたのCSSでより具体的になることによって行われます。 IMGのCSSの場合

：

#accordion ul li img { 
     opacity:0;  
    } 

CSS使用してカーソルを移動するには：まず第一に

#accordion div:hover { 
    color:#FFF; 
}