Question

我有一些包含图片的div。当悬停在div上时，图像应该旋转以创建类似效果的专辑。

我试图使用的方法在任何div上悬停时设置所有div的图像。我需要它只设计悬停div的孩子。

我希望有更多的div，我需要这样做而不指定每个div和div孩子？有没有明智的方法来实现这一目标？

HTML

 <div id="main">
        <div>
            <img src="../img/punime/1cc.jpg">
            <img src="../img/punime/2cc.jpg">
            <img src="../img/punime/3cc.jpg">
        </div>
        <div>
            <img src="../img/punime/1cc.jpg">
            <img src="../img/punime/2cc.jpg">
            <img src="../img/punime/3cc.jpg">
        </div>
        <div>
            <img src="../img/punime/1cc.jpg">
            <img src="../img/punime/2cc.jpg">
            <img src="../img/punime/3cc.jpg">
        </div>
        <div>
            <img src="../img/punime/1cc.jpg">
            <img src="../img/punime/2cc.jpg">
            <img src="../img/punime/3cc.jpg">
        </div>
    </div>

CSS

div#main div {
    width: 50%;
    height: 260px;
    position:relative;
    float:left;
    overflow:visible;
    }

div#main div > * {
    position:absolute;
    margin:auto;
    }

div#main div:hover + div img:first-child {
    transform:rotate(7deg);
    }

Answer 1

将CSS更新为

sam = check_output(["samn", "stats", myfile])

这意味着：对于#main div:hover img { /* styles here */ }中的任何div：设置所有作为徘徊#main

的孩子的图片。

仅当另一个元素是悬停元素的子元素时，才将元素悬停在另一个元素上？

1 个答案:

Codepen demo