CSS охватывающих DIV с другими, которые получили непрозрачностью с CSS

Question

Hi Folks Вот что я получил в CSS:

#loading { 
background:#000 url(loading.png) center; 
opacity:0.5; 
cursor:auto; 
min-height:250px; 
z-index:15; 
} 

#main { 
padding: 10px; 
z-index:1; 
} 

и в HTML:

<div id="loading"> 
     <div id="main">Something here</div> 
</div> 

и я ожидал loading.png для покрытия div # main, но это не так, и «Что-то здесь» остается на вершине load.png!?

Обновление: фон в CSS не изображение в загрузке div.

Answer 1

Ваш HTML неверен. ДИВО main должны быть вне ДИВ loading:

<div id="main"> 
    <div id="loading"></div> 
    Something here 
</div> 

Кроме того, необходимо поместить последний DIV с помощью CSS, так что это не просто нажать на основное содержание из-под него, а также определением размера DIV при 100% ширины и высоты его контейнера:

#main { position: relative; } 

#loading { 
background: url("loading.png"); 
opacity: 0.5; 
cursor:auto; 
width: 100%; 
height: 100%; 
z-index:15; 

/* Positioning */ 
position: absolute; 
left: 0; 
top: 0; 
}