asp.net – 没有透明度的div中的div的不透明度

发布时间：2020-12-15 23:26:41 所属栏目：asp.Net 来源：网络整理

导读：我必须使用asp.net ajax工具包来完成任务,而我所做的是在触发更新进度控制时在整个屏幕上显示一个div.主要的div(覆盖整个屏幕)有一些不透明度,但是当我尝试在这个内部有一个div时,即使我将它设置为none也可以获得一些不透明度; 示例HTML： ProgressTemplate

我必须使用asp.net ajax工具包来完成任务,而我所做的是在触发更新进度控制时在整个屏幕上显示一个div.主要的div(覆盖整个屏幕)有一些不透明度,但是当我尝试在这个内部有一个div时,即使我将它设置为none也可以获得一些不透明度;

示例HTML：

<ProgressTemplate>
            <div class="updateProgressBox">
                <div class="updateProgressMessage">
                    <p>Processing request..</p>
                </div>
            </div>
</ProgressTemplate>

和CSS：

.updateProgressBox {
    top: 0px; 
    height: 100%; 
    background-color:Gray;
    opacity:0.7; 
    filter:alpha(opacity=70);
    vertical-align: middle; 
    left: 0px; 
    z-index: 999999; 
    width: 100%; 
    position: absolute;
    text-align: center;   
}

.updateProgressMessage {
    border: black 2px solid;
    background-color: #fff;
    z-index: 1000000;   
    padding: 20px;
    opacity:1.0; 
    filter:alpha(opacity=100);
    margin: 300px auto auto auto;
    font-weight: bold; 
    vertical-align: middle;
    width: 200px; 
    text-align: center
}

我该怎么做,使div与消息没有透明度和白色背景颜色？

解决方法

要克服此问题,请使用父div背景上的RGBA background属性：rgba(64,64,0.5). 64,64是RGB颜色值. 0.5是不透明度值.现在,父级可以有自己的不透明度值,不会由其子级继承. FireFox,Opera,Chrome,Safari和IE9完全支持此功能.

检查工作示例在http://jsfiddle.net/Rp5BN/

为了支持IE 5.5到8,我们需要使用供应商特定的CSS’渐变滤镜：’所以你需要添加这个.

filter：progid：DXImageTransform.Microsoft.gradient(startColorstr =#7f404040,endColorstr =#7f404040);

其中7f表示127,即50％不透明度,404040是颜色.

检查IE http://jsfiddle.net/Rp5BN/2/中的工作示例

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!