背景颜色错误
所以我正在尝试制作一个非常简单的灯箱，我可以将其用于某些用途，但是无论出于何种原因，应该使背景变暗的 div 都会取消任何背景属性。
HTML
<div class="zoom-placeholder">
<div class="zoom-container">
<img class="zoom" src="image.png" />
</div>
</div>
CSS
.zoom {
margin: 1em 0em; padding: 1em;
background: #f9f9f9;
border: 1px solid #ccc; border-bottom-width: 2px;
box-shadow: rgba(0,0,0,0.075) 0px 2px 3px, inset rgba(255,255,255,0.5) 0px 0px 25px;
user-select: none;
user-drag: none;
}
.zoom-container, .zoom-placeholder {display:table-cell}
.zoom-container.open {
position: fixed;
z-index: 999;
width: 100%; height: 100%;
top: 0px; bottom: 0px;
left: 0px; right: 0px;
background: rgba(0,0,0,0,0.5); /* <--- Not Working --- */
}
.zoom-container.open .zoom {
width: auto;
height: auto;
position: absolute;
margin: 0em;
border-color: rgba(0,0,0,0.1);
box-shadow: rgba(0,0,0,0.5) 0px 10px 30px, inset rgba(255,255,255,0.5) 0px 0px 25px;
}
我没有任何东西可以重写它，但它仍然无法正确显示。
您可以在这里看到它的使用：
So I am attempting to make a really simple lightbox that I can use for something, however for whatever reason the div thats supposed to darken the background is canceling out any background attribute.
HTML
<div class="zoom-placeholder">
<div class="zoom-container">
<img class="zoom" src="image.png" />
</div>
</div>
CSS
.zoom {
margin: 1em 0em; padding: 1em;
background: #f9f9f9;
border: 1px solid #ccc; border-bottom-width: 2px;
box-shadow: rgba(0,0,0,0.075) 0px 2px 3px, inset rgba(255,255,255,0.5) 0px 0px 25px;
user-select: none;
user-drag: none;
}
.zoom-container, .zoom-placeholder {display:table-cell}
.zoom-container.open {
position: fixed;
z-index: 999;
width: 100%; height: 100%;
top: 0px; bottom: 0px;
left: 0px; right: 0px;
background: rgba(0,0,0,0,0.5); /* <--- Not Working --- */
}
.zoom-container.open .zoom {
width: auto;
height: auto;
position: absolute;
margin: 0em;
border-color: rgba(0,0,0,0.1);
box-shadow: rgba(0,0,0,0.5) 0px 10px 30px, inset rgba(255,255,255,0.5) 0px 0px 25px;
}
There isn't anything I have that's writing it over but its still not displaying correctly.
You can see this in use here:
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
看CSS
背景：rgba(0,0,0,0,0.5); /* <--- 不工作 --- */不工作，因为它无效 CSS3 应该是background: rgba(0,0,0,0.5);请注意缺少
0，因为 1 太多了。 R ed、G reen、B lue、A lpha 透明度。 :]Look at the CSS
background: rgba(0,0,0,0,0.5); /* <--- Not Working --- */is not working because that's invalid CSS3 should bebackground: rgba(0,0,0,0.5);Notice the missing
0you had 1 too many. R ed, G reen, B lue, A lpha transparency. :]你的问题是你的语句中有太多参数不起作用（你有 5 个，而应该只有 4 个）：
Your problem is you have too many parameters in the statement that is not working (you have 5 when there should only be four):