html - css3 悬停图像幻灯片，无法正常工作

Question

所以问题是当 #red 悬停时 #blue 不会改变大小，但当 #green 悬停时它会起作用。

#red:hover +#blue{
    width:50px;
    transition:0.5s;
}

JS FIDDLE

Answer 1

您可以使用 ~ 而不是 + 因为 #blue 不是您的 #red 的直接下一个兄弟这里:

#red:hover ~#blue{
    width:50px;
    transition:0.5s;
}

Updated Fiddle