设置灰色透明背景

时间:2014-09-02 17:26:33

标签: css colors

你好朋友我有一个显示处理图像的代码,但我不知道背景改变它的颜色,我需要将它改为灰色。

<body>
<form id="form1" runat="server">
<div>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
     <script type="text/javascript">
         // Get the instance of PageRequestManager.
         var prm = Sys.WebForms.PageRequestManager.getInstance();
         // Add initializeRequest and endRequest
         prm.add_initializeRequest(prm_InitializeRequest);
         prm.add_endRequest(prm_EndRequest);

         // Called when async postback begins
         function prm_InitializeRequest(sender, args) {
             // get the divImage and set it to visible
             var panelProg = $get('divImage');
             panelProg.style.display = '';
             // reset label text
             var lbl = $get('<%= this.lblText.ClientID %>');
             lbl.innerHTML = '';

             // Disable button that caused a postback
             $get(args._postBackElement.id).disabled = true;
         }

         // Called when async postback ends
         function prm_EndRequest(sender, args) {
             // get the divImage and hide it again
             var panelProg = $get('divImage');
             panelProg.style.display = 'none';

             // Enable button that caused a postback
             $get(sender._postBackSettings.sourceElement.id).disabled = false;
         }
     </script>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:Label ID="lblText" runat="server" Text=""></asp:Label>
            <div id="divImage" style="display:none" class="divCentro">
                <div class="FondoGris">
                     <asp:Image ID="img1" runat="server" ImageUrl="~/Procesando2.gif"/>
                    </div>
                <br />
                 <p class="divCentro"><br /><br /><br />Processing...</p> 
            </div>                
            <br />
            <asp:Button ID="btnInvoke" runat="server" Text="Click"
                onclick="btnInvoke_Click" />
        </ContentTemplate>
    </asp:UpdatePanel>
</div>
</form>

这是css代码:

<style type="text/css">
    .divCentro {
        text-align:center;
        width: 327px; height: 60px; margin-top: -23px; margin-left: -158px; left: 50%; top: 40%;    position: absolute;
    }

</style>

我尝试过编写背景颜色:灰色透明,但这只会改变div图像中的颜色。

如果有人有任何建议,请帮助我。

提前致谢!

2 个答案:

答案 0 :(得分:1)

尝试这个..

 <div class="divOuterCentro">
 <p class="divCentro"><br /><br /><br />Processing...</p>
 </div>

CSS:

.divOuterCentro{
   height:100%;
   width:100%;
   background-color:rgba(0,0,0,0.4);
   position:absolute;
 }
 .divCentro {
    text-align:center;
    width: 327px; 
    height: 60px; 
    margin-top: -23px; 
    margin-left: -158px; 
    left: 50%; 
    top: 40%;    
    position: absolute;
}

工作小提琴.. link here

答案 1 :(得分:0)

要创建半透明背景,请使用rgba()或hsla()函数:

.divCentro {
    background-color: rgba(60, 60, 60, 0.5);
}