编辑:更正了标题
我想在HTML和CSS中模拟一个模态弹出窗口,但在做的过程中有一个元素一直让我头疼。我希望最内层的div,也就是内容区域,不像边框那样不透明,但是无论我在CSS中尝试什么,都不能得到想要的效果。以下是代码:
CSS代码:
.modalBackground {
background-color:Gray;
filter:alpha(opacity=70);
opacity:0.7;
}
这是HTML
<table style="height: 100%; width: 100%; position: fixed; top: 0; left: 0;"><tr><td class="modalBackground">
<div style="display: table; height: 40px; width: 150px; position: fixed; overflow: hidden;
top: 40%; margin-top: -50px; left: 50%; margin-left: -75px; padding-left: 30px;
border: solid 1px navy; background-color: White;">
<div style="#position: absolute; #top: 50%; display: table-cell; vertical-align: middle;">
<div style="#position: relative; #top: -50%;"
><asp:Image runat="server" ImageUrl= "~/images/indicators/indicatordark.gif" /> working...</div>
</div>
</div></td></tr></table>
我在这件事上已经到了疲惫不堪的地步。我并不是HTML或CSS方面的专家,因此如果能解释一下为什么这个解决方案可行,那将不胜感激。