È possibile impostare la trasparenza in CSS3 box-shadow?

Question

È possibile impostare la trasparenza sull'ombra della casella?

Questo è il mio codice:

box-shadow:10px 10px 10px #000; 
    -webkit-box-shadow:10px 10px 10px #000; 
    -moz-box-shadow: 10px 10px 10px #000; 

Answer 1

Suppongo rgba() sarebbe lavorare qui. Dopotutto, il supporto del browser sia per box-shadow sia per rgba() è più o meno lo stesso.

/* 50% black box shadow */ 
box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); 

div { 
 
    width: 200px; 
 
    height: 50px; 
 
    line-height: 50px; 
 
    text-align: center; 
 
    color: white; 
 
    background-color: red; 
 
    margin: 10px; 
 
} 
 

 
div.a { 
 
    box-shadow: 10px 10px 10px #000; 
 
} 
 

 
div.b { 
 
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); 
 
}

<div class="a">100% black shadow</div> 
 
<div class="b">50% black shadow</div>