CSS3中:hover背面隐藏相关问题

img

img

img

img


紫色div标签为什么不显示?

改直接子节点才翻转,要不nth-of-type相对于在box div下的蓝色和朱色的div也是作用的,所以hover后第二个div中的紫色div也转了-180deg看不到了

img

img

改直接子节点才翻转后就不会作用到内部的div了

img


 .box>div:nth-of-type(1) {
        background: rgb(142,104,65);
        transform: rotateY(0deg)
    }
    .box > div:nth-of-type(2) {
        background: red;
        transform: rotateY(-180deg)
    }
    .box:hover > div:nth-of-type(1) {
        background: rgb(142,104,65);
        transform: rotateY(-180deg)
    }
    .box:hover > div:nth-of-type(2) {
        background: red;
        transform: rotateY(0deg)
    }

看下你box盒子,及子盒子的尺寸。被盖住了,