¿Es posible establecer la transparencia en CSS3 box-shadow?

Question

¿Es posible establecer la transparencia en la sombra de la caja?

Este es mi código:

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

Answer 1

supongo rgba() funcionaría aquí. Después de todo, el soporte de navegador para box-shadow y rgba() es aproximadamente el mismo.

/* 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>