转一个div变成透明的，通过两个容器看到 [英] turning a div into transparent to see through two containers
问题描述
我有以下标记
<body>
<div class="holder">
<div class="circle"></div>
</div>
</body>
和我申请一个固定的背景，以应用于类支架主体元素，白色背景
and i have applied a fixed background to body element and white background applied to class holder
body {
background: url(image.png);
background-attachment: fixed;
}
.holder {
width: 500px;
height: 500px;
background: #fff;
}
.circle {
width: 100px;
height: 100px;
border-radius: 50%;
background: rgba(0, 0, 0, 0);
}
我所试图做的是使圈透明的看到身体的背景。简单地说，我试图IS，使得圈透明的看到身体的背景图像，而周围一圈白色的背景仍然存在。请原谅我的英语。伙计们，请帮助我。
what i have tried to do is to make the circle transparent to see the body background. Simply, what i am trying is, making the circle transparent to see the body background image while the white background around the circle still exist. please excuse my English. Guys please help me.
推荐答案
你所要求做透明使用将无法正常工作。
What you are asking to do will not work using transparency.
然而，有一个变通是完全可以接受的：
However, there is a work around that is quite acceptable:
body {
background: url(http://placekitten.com/g/400/500);
background-attachment: fixed;
}
.holder {
width: 500px;
height: 700px;
background: rgba(255,255,255,0.8);
border: 1px dotted blue;
}
.circle {
width: 100px;
height: 100px;
border-radius: 50%;
background: url(http://placekitten.com/g/400/500);
background-attachment: fixed;
}
看演示在： http://jsfiddle.net/audetwebdesign/FqMXz/
就采用相同的背景图像的 .circle DIV。
Just apply the same background image to the .circle div.
这招是从由埃里克迈耶CSS的书籍之一服用。
This trick is taken from one of the CSS books by Eric Meyer.
这篇关于转一个div变成透明的，通过两个容器看到的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
