html - 当我们关注链接时如何为 child 添加样式 block ？

Question

代码:

<div id="div1">
    <div class="test1"></div>
    <div class="text1"><a href="#">test1</a>
    </div>
    <div class="test_block">text1</div>
</div>

<div id="div2">
    <div class="test2"></div>
    <div class="text2"><a href="#">test1</a>
    </div>
    <div class="">text2</div>
</div>

如何在 css3 上使当我们关注链接(a:hover)时子 block test_block 得到 css font-size:18px？

P.S.:例如，当我们将鼠标悬停在链接 test1 上时，text1 的 font-size 将为 18 px，而 font- text2 的大小 将是 14px;

当我们将鼠标悬停在链接 test2 上时，text2 的 font-size 将为 18 px 和 font-size 对于 text1 将是 14px;

Answer 1

使用相邻兄弟选择器，+:

.text1,
.text2 {
    font-size: 14px;
}

.test1:hover + .text1,
.test2:hover + .text2 {
    font-size: 18px;
}