div的背景不會改變透明度

我有一個div'floater_EditData_Panel_popup'，其中包含updatepanel，佔位符和更多的div。div的背景不會改變透明度

我想增加外部div'floater_EditData_Panel_popup'的透明度，以允許用戶只看到背景，只是稍微。

到目前爲止div的背景顏色保持白色，而文本框褪色

.floaterDiv{ 
    top: 0%; 
    left: 0%; 
    height: 450px; 
    width: 800px; 
    border: solid 1px blue; 
    /*background-color:white;*/ 
    background-color:rgba(255,0,0,0.5); 
    margin:1; 
    text-align:left; 
    outline-style: none; 
    display:none; 
    overflow:hidden; 
    zoom: 1; 
    filter: alpha(opacity=40); 
    opacity: 0.4; 
    z-index:999999999999; 
    /* background-blend-mode: multiply;*/ 
} 



<div id="floater_EditData_Panel_popup" title="Feature Information" class="floaterDiv"> 
    <p1>Select a feature to view/edit feature information.</p1> 
    <br /> 
    <br /> 
    <br /> 
     <asp:UpdatePanel runat="server" id="UpdatePanelDetails1" updatemode="Conditional" Childrenastriggers="true"> 
     <ContentTemplate> 
      <asp:PlaceHolder ID="PlaceHolder1" runat="server" > 
      </asp:PlaceHolder> 
      <br /> 
      <br /> 
      <div id="EditDataPanelMessageOutput" style="color:Red;"> 

     </div> 
      <div id="FeatureMeasureOutput"></div> 
      <br /> 
      <br /> 
      <div class="buttonwrap"> 
      <div id="Span2" class="ActionBtns" style="display: inline-block;" > 
       <asp:button runat="server" id="UpdateButton" value="Save" Text="Save" OnClientClick="ValidateEditData();" CausesValidation="true" ValidationGroup="g_currentSelectedLayerName" /> 
      </div> 
      </div> 
      <asp:ValidationSummary runat="server" ID="valSummary1" HeaderText="You must enter a value in the following fields:" DisplayMode="BulletList" EnableClientScript="true" ShowSummary="true" Enabled="true" /> 

     </ContentTemplate> 

     </asp:UpdatePanel> 
    </div>

產生如下：

enter image description here

請指教

來源

2014-10-07 John

首先，避免使用'opacity'用於這一目的。最好使用'rgba（）'背景色。其次，''.floaterDiv'周圍可能會有另一個包裝元素具有白色背景色。如果有的話，刪除它的背景顏色。 – 2014-10-07 11:34:30

嘗試將背景改爲黑色而不是白色'background-color：rgba（0,0,0,0.5）;' – Benjamin 2014-10-07 11:34:33

@HashemQolami感謝回覆iv嘗試rgba但沒有效果。 – John 2014-10-07 11:38:48

top: 0%; 
    left: 0%; 
    height: 450px; 
    width: 800px; 
    border: solid 1px blue; 
    background-color:rgba(255,255,255,0.5) !important; 
    /* overrule other css statements */ 
    margin:1; 
    text-align:left; 
    outline-style: none; 
    display:none; 
    overflow:hidden; 
    zoom: 1; 
    z-index:999999999999;

如果這不起作用，你應該檢查是否其中CSS語句正在將背景更改爲白色或#FFF顏色。檢查Chrome和檢查元素風格

來源

2014-10-07 11:36:25

對不起，我忘了從文本中刪除它，已將其從代碼中刪除，但沒有區別 – John 2014-10-07 11:37:57

您是否還刪除了所有不透明的東西？ – 2014-10-07 11:40:12

添加！重要推翻其他陳述 – 2014-10-07 11:47:52

嘗試刪除

filter: alpha(opacity=40); 
opacity: 0.4;

這是影響DIV的內容，而不是背景本身。

你也應該改變RGBA值

rgba(255,255,255,0.3);

對於白色半透明背景

來源

2014-10-07 11:47:42

div的背景不會改變透明度

回答

相關問題