是：懸停只限於子元素？

Question

我剛纔看到這段代碼的答案：

HTML

<div class="thumbnail"> 
    <img src="http://placehold.it/50x50"> 
    <img class="overthumb" src="http://placehold.it/200x200"> 
</div> 

CSS

.overthumb { display: none; } 

.thumbnail:hover .overthumb { 
    position: absolute; 
    top: 15px; left: 15px; 
    display: inline; 
} 

現場演示這裏：http://jsfiddle.net/6wQp3/

對於此代碼工作.overthumb必須是小孩d的.thumbnail。

但如果一些人有這樣的代碼：

<div class="thumbnail"> 
    <img src="http://placehold.it/50x50"> 
</div> 
<p>tttttttttt</p> 

你會如何選擇p標籤如果.thumbnail懸停？

Answer 1

Live Demo

可以使用adjacent sibling selector

.thumbnail:hover + p { 
    background:yellow; 
} 

Answer 2

您可以使用以下的選擇

.thumbnail:hover + p 

例子：http://jsfiddle.net/6wQp3/2/