家長背景兒童的

Question

我想知道也許有什麼辦法可以用CSS來做到這一點。

我有父母的div和孩子之一。孩子總是會有背景顏色，我想在數據加載的情況下切換額外的類。所以當數據加載時，父div將具有背景圖像和顏色（可能是rgba具有透明度）。 我想這樣做與父母的原因是我不知道兒童的確切數量，或由此產生的高度，所以加載覆蓋div似乎不是一個好主意...

http://jsfiddle.net/3Xpnx/15/這裏是小提琴，其中可以看出，孩子的背景是在父母

.parent{ 
background: url('http://www.securenet.com/sites/default/files/spinner.gif') no-repeat scroll 0% 0%/contain #FFF; 
z-index:10000; 
position:relative; 

}

.child{ 
    width:300px; 
    height:300px; 
    background-color: rgba(0,250,250,.7); 
} 

Answer 1

你可以用這將對一旦加載結束被刪除僞元素做到這一點（但這是另一個問題） 。在這裏，我使用懸停來顯示它的開啓和關閉。

JSfiddle Demo

HTML

一些內容

CSS

.parent { 
    position: relative; 
} 
.parent:after { 
    position: absolute; 
    content:""; 
    top:0; 
    left:0; 
    bottom:0; 
    right:0; 
    background: url('http://www.securenet.com/sites/default/files/spinner.gif') no-repeat scroll 0% 0%/contain #FFF; 
} 

/* temp hover state for demo purposes*/ 

.parent:hover:after { 
    display:none; 
} 

.child { 
    width:300px; 
    height:300px; 
    background-color: rgba(0, 250, 250, .7); 
}