CSS "see-through"背景 - 疯狂导航菜单问题

Question

我有一个疯狂的导航菜单，我必须编写代码。这有点难。请在此处查看设计的屏幕截图:

navigation menu screenshot

如您所见，“主页”菜单项的背景非常硬朗!我不知道如何使它的背景“透明”，这意味着它会穿透深色背景并显示带图案的绿色背景。

你知道如何使用 css 做到这一点吗？

提前致谢。

Answer 1

您可以使用:

background: transparent;
background: inherit;

但是，您需要构建您的 HTML，以便主页、期刊 等。链接嵌入在带有背景的框中。

---

对于圆 Angular ，check this out .

或者您可以使用具有形状透明度的图像作为背景。

---

@Gary [comment]:inherit 获取它在层次结构中找到的第一个设置。因此，如果您有一个中间层，它会改用其设置。

然后您可能会尝试使用:

background-image: url('greencheckers'); /* outer */

background-color: black;                /* middle */

background-image: inherit;              /* link */

理论上，它应该寻找第一个 background-image 设置，然后。但是，我从来没有用过这个，所以不能保证。