div的CSS遮罩部分以在下面显示div？ [关闭]

【问题标题】：CSS mask part of div to show div underneath? [closed]div的CSS遮罩部分以在下面显示div？ [关闭]
【发布时间】：2013-09-24 20:55:34
【问题描述】：

我正在尝试构建一个“帮助”叠加层，其中大部分页面都被透明叠加层覆盖，但某些区域上方有圆圈，页面显示在其中。例如，我可以创建以下 div 作为我的叠加层，然后在相关区域周围放置一个圆形 div - 但我该怎么做才能使叠加层下方的内容显示出来？（据我所知，没有 z-index 或透明度的组合可以实现这一点）

 .overlay {
     width: 100%;
     height: 100%;
     background-color: rgba(0,0,0,.5);
 }

【问题讨论】：

把这个作为题外话踢掉真的很伤心。我看到的主要原因是，不幸的是，对于可以（并且应该）拥有的东西没有简单的解决方案。可能存在一个允许 div 填充其边框而不是内部的简单选项，并且您不知道这样的选项不存在，直到......您知道。

标签： css overlay transparency

【解决方案1】：

您的问题有点不具体。很难理解你的问题是什么。

也许您正在寻找类似的东西？

fiddlehttp://jsfiddle.net/7CPbY/4/

编辑：

您可以尝试在您的区域周围创建四个具有相同背景颜色的 div。第五个 div（区域上方）可以是一个颜色相同的图像，中间是一个透明的圆圈。

----------------
|     div      |
----------------
|div| area |div|
----------------
|     div      |
----------------

【讨论】：

谢谢，但不是我要找的……显然，我需要找到一种更好的表达方式。我基本上想制作一个不接收“覆盖”背景的圆形 div，这样您就可以看到它下面的页面内容，而顶部没有灰色。本质上就像屏蔽图像。我怀疑这在 CSS 中是不可能的，至少不是直接的——我希望可能有一个偷偷摸摸的解决方法。
谢谢！ div 解决方案看起来很有希望 - 将对其进行测试！