css悬停以更改其他元素的不透明度值

Question

<div class="logoWrap">
<img src="https://i.imgur.com/OBFbjSK.png">
    <p class="logoDesc">this is img desc</p>
</div>

我想避免使用javascript，是否可以使用：hover更改其他元素的值？如果可能的话，我想添加过渡。

http://jsfiddle.net/UH2Aq/

Answer 1

您的意思是您希望将鼠标悬停在logoWrap上以显示logoDesc吗？

如果是这样的话： http://jsfiddle.net/wildandjam/emELN/

.logoWrap:hover .logoDesc{
    opacity:1;
}

然后，如果需要，可以添加CSS3过渡，以使其更流畅。

Answer 2

转换的答案相同：http://jsfiddle.net/UH2Aq/1/

.logoDesc{

 transition: opacity .2s ease-in-out;
    opacity : 0;
}

.logoWrap:hover .logoDesc {
    opacity: 1;
}