CSS：悬停时同时显示和隐藏不同的div？

Question

下面是CSS例如如何显示隐藏的div（悬停）：

<div class="showhim">HOVER ME<div class="showme">hai</div></div> 

和

.showme{ 
display: none; 
} 
.showhim:hover .showme{ 
display : block; 
} 

我能告诉一个股利和仅使用隐藏在同一时间另一个CSS？ 下面是示例演示如何使用JS为了这个目的：http://jsfiddle.net/joshvito/GaZQ6/

Answer 1

http://jsfiddle.net/MBLZx/

下面是代码

.showme{ 
 
    display: none; 
 
} 
 
.showhim:hover .showme{ 
 
    display : block; 
 
} 
 
.showhim:hover .ok{ 
 
    display : none; 
 
}

<div class="showhim"> 
 
    HOVER ME 
 
    <div class="showme">hai</div> 
 
    <div class="ok">ok</div> 
 
</div> 
 

 

Answer 2

如果其他分区是兄弟姐妹/孩子，或任何组合，对父母来说是

.showme{ 
 
     display: none; 
 
    } 
 
    .showhim:hover .showme{ 
 
     display : block; 
 
    } 
 
    .showhim:hover .hideme{ 
 
     display : none; 
 
    } 
 
    .showhim:hover ~ .hideme2{ //~ sibling selector 
 
     display:none; 
 
    }

<div class="showhim"> 
 
     HOVER ME 
 
     <div class="showme">hai</div> 
 
     <div class="hideme">bye</div> 
 
    </div> 
 
    <div class="hideme2">bye bye</div>

Answer 3

你试过这样的事吗？

.showme{display: none;} 
.showhim:hover .showme{display : block;} 
.hideme{display:block;} 
.showhim:hover .hideme{display:none;} 

<div class="showhim">HOVER ME 
    <div class="showme">hai</div> 
    <div class="hideme">bye</div> 
</div> 

我不知道为什么它不应该成为可能。