CSS-更改基础元素的唯一方法属性？

Question

当在页面上的元素上检测到 "hover" 事件时，是否有一种方法可以 "passively"（仅限 CSS）更改主体的背景？

类似

body div:hover 这将触发 body 的背景图像

我想那样做，因为我不知道编码但是运行一个 wordpress 站点...

Answer 1

抱歉，David 在 CSS 中，您无法仅在向下的级联方向上获得向上的手柄。您需要为此编写脚本。

Answer 2

没有 CSS 父选择器，但您可以通过使用固定位置 div 和负数 z-index 来实现您的目标，它是悬停的元素：

.fixed {
  position: fixed;
  z-index: -1;
}

button:hover ~ .fixed {
  left: 0px;
  top: 0px;
  height: 100%;
  width: 100%;
  background: yellow;
}

<button>Hover over me</button>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
<button>Hover over me</button>
<div class="fixed"></div>

CSS-更改基础元素的唯一方法属性？

CSS-only way to change underlying elements property?

css

wordpress

Fiddle