изображения все еще показывает полупрозрачный непрозрачность после изменения значения непрозрачности

Question

функциональность:

На следующей странице является прозрачной и имеет opacity: 0.68; и в пределах страницы, у меня есть изображение с opacity: 1.0;. Основная идея заключается в том, что изображение помещается в оверлей над полупрозрачным фоном, и изображение не должно делиться с тем же полупрозрачным свойством, что и фон.

Выпуск:

Изображения в полупрозрачный странице обмен же полупрозрачный собственности, даже если я установить непрозрачность свойство изображения будет 1,0.

Как я могу установить изображение в твердотельное состояние, не показывая свойство непрозрачности, которое я установил из основного фона?

.BrandMenu { 
 
    background-color: #D3D3D3; 
 
    filter: alpha(opacity=98); 
 
    opacity: 0.98; 
 
} 
 
.BrandDescription { 
 
    background-color: #FFFFFF; 
 
    filter: alpha(opacity=200); 
 
    opacity: 1.0; 
 
}

<div id="Park_BrandDescription" class="BrandMenu" align="center" style="position:absolute; width:1080px; height:1920px; background-repeat: no-repeat; display: none; z-index=9; top:0px; margin:auto;"> 
 

 
    <img id="Pa_Description" class="BrandDescription" style="position:absolute; width: 1080px; height:650px; top:500px; background-color: white; left:0px; z-index=99;"> 
 
</div>

Answer 1

Причина объясняется в ответе @eisbehr, но вы можете иметь полупрозрачный фон с rgba() значениями, не влияя на непрозрачность дочерних элементов:

.BrandMenu { 
 
    background-color: rgba(211, 211, 211, 0.98); 
 
} 
 
.BrandDescription { 
 
    background-color: #FFFFFF; 
 
}

<div id="Park_BrandDescription" class="BrandMenu" align="center" style="position:absolute; width:1080px; height:1920px; background-repeat: no-repeat; display: block; top:0px; margin:auto;"> 
 

 
    <img id="Pa_Description" class="BrandDescription" style="position:absolute; width: 1080px; height:650px; top:500px; background-color: white; left:0px;" src="http://lorempixel.com/400/200"> 
 
</div>

И нет 2.0 значения непрозрачности, максимум 1.0 (100%)

Answer 2

Вы не можете сделать элемент полностью видимый с opacity, когда родительские элементы не полностью видны. Родители имеют opacity, а 1.0 - максимум. Воображение установки так:

<div style="opacity: .5;"> 
    This text here has a opacity of 50%! 
    <div style="opacity: .5;"> 
    This text here has a opacity of 25%! 
    <div style="opacity: .5;"> 
     This text here has a opacity of 12.5%! 
     <div style="opacity: 1;"> 
     This text here has still a opacity of 12.5%! 
     </div> 
    </div> 
    </div> 
</div>