用不透明的div里面的DIV没有透明度 [英] No opacity on div inside a div with opacity

问题描述

我不得不使用asp.net Ajax工具包的任务，我做的是，当一个更新进度控制触发在整个屏幕上显示一个div。主要格（覆盖整个屏幕）是有一些不透明度，但是，当我尝试有这样一说一也得到即使我把它设置为none一些不透明里面的div;

I have to use the asp.net ajax toolkit for a task and what I am doing is to display a div on the whole screen when an update progress control is triggered. The main div (that covers the whole screen) is having some opacity but when I try to have a div inside this one that one also gets some opacity even though I set it to 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没有透明度和白色背景颜色？

What should I do to make the div with the message have no transparency and white background color?

推荐答案

要解决此问题，使用的RGBA背景属性在父分区背景：RGBA（64，64，64，0.5）。 64，64，64是RGB颜色值。和0.5是不透明度值。现在母体可以具有不会被其子继承其自身的不透明度值。这是由Firefox，歌剧，铬，Safari和IE9完全支持。

To overcome this issue, use the RGBA background property on the parent div background: rgba(64, 64, 64, 0.5). 64, 64, 64 are the RGB color values. and 0.5 is the opacity value. Now parent can have its own opacity value that will not be inherited by its children. This is fully supported by FireFox, Opera, Chrome, Safari and IE9.

要支持IE 5.5〜8，我们需要使用CSS供应商特定的渐变滤镜：所以你需要添加此

To support IE 5.5 to 8 we need to use vendor-specific CSS 'gradient filter:' So you need to add this.

过滤器：进程id：DXImageTransform.Microsoft.gradient（startColorstr =＃7f404040，endColorstr =＃7f404040）;

其中1408米再presents 127，即50％的不透明度和404040是颜色。

Where 7f represents 127, i.e. 50% opacity and 404040 is the color.

这篇关于用不透明的div里面的DIV没有透明度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！