2014-10-07 8 views
0

У меня есть div 'floater_EditData_Panel_popup', который содержит updatepanel, placeholder и больше divs.фон div wont change transparent

Я хочу увеличить прозрачность внешнего 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

пожалуйста посоветуйте

+1

Прежде всего, избежать использования 'opacity' для этой цели. Лучше использовать цвет фона 'rgba()'. Во-вторых, может быть другой элемент-обертка, имеющий белый цвет фона вокруг '.floaterDiv'. Если есть, удалите его цвет фона. –

+0

Попробуйте изменить фон на черный, а не белый 'background-color: rgba (0,0,0,0,5);' – Benjamin

+0

@HashemQolami спасибо за ответ iv попытался rgba, но никакого эффекта. – John

ответ

0
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. Проверьте хром и осмотрите элемент стиля

+0

жаль, что я забыл удалить это из текста, удалил его из кода, но без разницы – John

+0

Вы также удалили весь материал непрозрачности? –

+1

Добавить! Важно, чтобы отменить другие заявления –

1

Try извлекая

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

Это влияет на содержимое DIV, а не сам фон.

Вы также должны изменить значения RGBA для

rgba(255,255,255,0.3); 

Для белой полупрозрачной фоне