Как при :hover родителя поменять дочерний элемент?
div:hover span {/*стиль для всех span внутри div */
}div:hover > span {/*стиль для всех span - прямых наследников div */
}div:hover + span {/*стиль для первого span после div */
}
Пример: jsfiddle.net/2yuak32u/1<div class='parent'>
    <span class='child1'>1</span>
    <span class='child2'>2</span>
</div>.child1 {
    display: block;
}
.child2 {
    display: none;
}
.parent:hover .child1 {
    display: none;
}
.parent:hover .child2 {
    display: block;
}