[[group (Tailwind CSS)|group]]を使う。
```html
<ul class="group p-16 m-16 bg-amber-50 space-y-4">
<li class="group-hover:font-bold">親がホバーされたら太字</li>
<li class="hover:font-bold">自分がホバーされたら太字</li>
<li>変化なし</li>
</ul>
```
名前つきの場合。
```html
<div class="group/outer p-16 bg-red-200">
<ul class="group/inner p-16 m-16 bg-amber-50 space-y-4">
<li class="group-hover/outer:font-bold">外の親がホバーされたら太字</li>
<li class="group-hover/inner:font-bold">内の親がホバーされたら太字</li>
<li class="hover:font-bold">自分がホバーされたら太字</li>
<li
class="bg-black text-white group-hover/outer:text-red-200 group-hover/inner:text-amber-50!"
>
ホバーされた親の色にあわせる
</li>
</ul>
</div>
```