通过透明技术查看孩子中父母的父母颜色

Question

这是一个非常奇怪的请求，但是我想知道是否有可能。我已经凝视了一段时间了，甚至不确定最长的解释时间。

我需要子div的背景作为父div的父背景。

.body {
  width: 150px;
  height: 150px;
  margin: 0 auto;
  background-color: lavender;
}

.parent {
  width: 100px;
  height: 100px;
  background-color: pink;
}

.child {
  width: 50px;
  height: 50px;
  background-color: blue;
  
}

.center {
  display: flex;
  justify-content: center;
  align-items: center;
}

<div class="body center">
  <div class="parent center">
    <div class="child center" />
  </div>
</div>

如果运行代码并查看视觉效果，您将看到结构如下：

身体==薰衣草

父母==粉色

儿童==蓝色

这可能无法实现，但是我要完成的工作是在孩子中“透视”父母，以使孩子的背景成为身体的淡紫色。理想情况下，我应该对孩子有一个透明的背景，而父母应该以某种方式使这种透明化成为可能。