透明前景

Question

我想添加一個半透明的統一圖層作爲div元素的前景。什麼是最好的方式來做到這一點？

Answer 1

你可以使用這個CSS ...

div.parent { 
    position: relative; 
} 

/* this div is a descendent of the div above */ 
div.child { 
    position: absolute; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    opacity: .6; 
    background: #fff; 
} 

jsFiddle。

如果你想要鼠標事件去通過這個封面，添加pointer-events: none到div.child。

你標記它的jQuery，所以這個孩子元素通過jQuery添加...

$('div.parent').append('<div class="child" />');