更改链接悬停时的主体背景颜色

尽管Mike Ross的演示解决了您的问题，但并未说明其工作原理或原因。它也可以大大简化。

基本上，您想::before在元素上使用符号。这将创建一个伪元素，它是关联元素的第一个子元素，您可以为其应用其他样式。然后，您可以设置::before选择器的样式，以使屏幕充满特定的背景色。例如：

<a class="special">Test</a>

.special:hover:before{
    content: '';
    position: fixed;
    display: block;
    top: 0; bottom: 0; left: 0; right: 0;
    z-index: -1;
    background-color: #ff0000;
}

您不需要nth-of-type在那里或其他任何东西。在这里看我的小提琴。您需要做的就是确保before元素在z顺序的后面是全屏并且具有特定的颜色。