隐藏透明DIV后面的元素，但不包括背景

Question

所以我已经圈出了div（与border-radius），并且每个都连接了一条线。问题在于它们是半透明的，并且它们从div的中心连接，因此您可以通过div看到一条线。我可以让div不透明，但我不想显示背景。那么，是否有隐藏div背后的特定元素的方法，但显示页面的背景？即使它使用js/jquery。

这里是我的模拟情况（在我行代码自动生成）：

https://jsfiddle.net/muud6rqf/2/

body{ 
 
    background: url(http://www.intrawallpaper.com/static/images/abstract-mosaic-background.png) no-repeat center center fixed; 
 
    background-size: cover; 
 
} 
 

 
.circle{ 
 
    border: 2px solid red; 
 
    width: 36px; 
 
    height: 36px; 
 
    border-radius: 100%; 
 
    position: absolute; 
 
    box-shadow: 0 0 8px 2px rgba(255,0,0,0.6), inset 0 0 8px 2px rgba(255,0,0,0.6); 
 
} 
 

 
.simulated-line{ 
 
    position: absolute; 
 
    width: 181px; 
 
    height: 4px; 
 
    background: green; 
 
    top: 64px; 
 
    left: 118px; 
 
    transform-origin: 0% 50%; 
 
    transform: rotate(25deg); 
 
}

<div class="circle" style="left: 100px; top: 46px"></div> 
 

 
<div class="circle" style="left: 260px; top: 121px"></div> 
 
    
 
<div class="simulated-line"></div>

编辑：这是什么样子：

这是我想要的：

Answer 1

及其与z-index一个小黑客，我不知道这是否可以为你或你的很好的解决方案不是，但你可以看看片段。

将z-index:-1加到.simulated-line所以线条会回到圆圈。

将background: inherit;加上.circle这样背景就被填满了。

body{ 
 
    background: url(http://www.intrawallpaper.com/static/images/abstract-mosaic-background.png) no-repeat center center fixed; 
 
    background-size: cover; 
 
} 
 

 
.circle{ 
 
    border: 2px solid red; 
 
    width: 36px; 
 
    height: 36px; 
 
    border-radius: 100%; 
 
    position: absolute; 
 
    box-shadow: 0 0 8px 2px rgba(255,0,0,0.6), inset 0 0 8px 2px rgba(255,0,0,0.6); 
 
    background: inherit; 
 
} 
 

 
.simulated-line{ 
 
    position: absolute; 
 
    width: 181px; 
 
    height: 4px; 
 
    background: green; 
 
    top: 64px; 
 
    left: 118px; 
 
    transform-origin: 0% 50%; 
 
    transform: rotate(25deg); 
 
    z-index: -1; 
 
}

<div class="circle" style="left: 100px; top: 46px"></div> 
 

 
<div class="circle" style="left: 260px; top: 121px"></div> 
 
    
 
<div class="simulated-line"></div>