Css 过渡和 div

Question

我有这样的dom结构:

<div class="wrapper">
   <div class="style1"> ... another divs ... </div>
</div>
<div class="wrapper">
   <div class="style2"> ... another divs ... </div>
</div>
<div class="wrapper">
   <div class="style1"> ... another divs ... </div>
</div>
<div class="wrapper">
   <div class="style2"> ... another divs ... </div>
</div>
<div class="wrapper">
   <div class="style1"> ... another divs ... </div>
</div>

在 style1 和 style2 中，所有内部 div(标记为“另一个 div”)都有 background-color 设置。

现在我想为 style1 和 style2 中的所有 div 进行后台转换:

.wrapper :hover
{
    background-color: #ccc;
}

.wrapper
{
    -moz-transition: background .2s linear;
    -webkit-transition: background .2s linear;
    -o-transition: background .2s linear;
    transition: background .2s linear;
}

它不起作用(没有任何变化)。当我为 style1 和 style2 设置悬停属性时，它会改变背景，但只有主动潜水时鼠标才会结束。

Answer 1

删除 .wrapper 和 :hover 之间的空格。但我可能误读了这个。您可能想要执行 .wrapper:hover .style1 div{}