在DIV中改变不透明度

Question

我有菜单，示例代码：

<ul>
    <li>
        <a href="#"><span id="header1" class="menu_header">WELCOME</span></a>
        <!--Submenu-->
        <div id="sub_backbone"></div>
    </li>
</ul>

#header1此标题菜单#sub_backbone此标签是默认的透明

div#sub_backbone{
    opacity: 0;
}

我需要将鼠标悬停在WELCOME上，＃sububback不透明度变为1 。

Answer 1

那不是那么难......

您必须使用hover，如下所示：http://jsfiddle.net/xbMtN/3/

div#sub_backbone:hover {
    opacity: 1;
}

编辑，我看到你改变了你的问题。你走了：

ul li:hover > div#sub_backbone { 
    opacity: 1;
}

div#sub_backbone{
 opacity: 0.3;
}

http://jsfiddle.net/xbMtN/4/

Answer 2

您应该使用兄弟选择器+：

li a:hover + #sub_backbone {
    opacity: 1;
}

演示：http://jsfiddle.net/N8ghp/

支持：IE8+。