使用CSS伪元素控制连续几个元素的样式方法

<div class="A"></div>
<div class="B"></div>
<div class="C"></div>
<div class="D"></div>

//相应用A控制BCD的CSS代码
    .A:hover + .B{
        background-color: orange;
    }
    .A:hover + .B+ .C{
        background-color: orange;
    }
    .A:hover + .B+ .C+ .D{
        background-color: orange;
    }

<div class="A">
    <div class="B"></div>
    <div class="C"></div>
    <div class="D"></div>
</div>

//相应的CSS代码
    .A:hover .B{
        background-color: orange;
    }
    .A:hover .B+ .C{
        background-color: orange;
    }
    .A:hover .B+ .C+ .D{
        background-color: orange;
    }