Dropshadow con css

Question

Quiero agregar una dropshadow transparente a mi div. Tengo un contenedor y detrás de él quiero colocar una sombra de gotas. No quiero que la sombra de gotas tenga un color. Esto es lo que tengo hasta ahora:

.content_right1{ 

    background:#fff; 

    -moz-border-radius: 10px; 
    -webkit-border-radius: 10px; 
    border-radius:10px; 

    -moz-box-shadow: 5px 5px 5px #99CCFF; 
    -webkit-box-shadow: 5px 5px 5px #99CCFF ; 
    box-shadow: 5px 5px 5px #99CCFF; 

    /* other styles of the class */ 
    width:380px; 
    float:left; 

    margin-left:3px; 
    padding:15px; 

    min-height:450px; 
    margin-left:15px; 
} 

Quiero añadir la opacidad, pero cuando lo haga la opacidad de la totalidad de los cambios div.

Answer 1

Si bien su pregunta es en última instancia un poco opaca (juego de palabras), ¿hace lo siguiente lo que está esperando?

-moz-box-shadow: 5px 5px 5px #dddddd; 
-webkit-box-shadow: 5px 5px 5px #dddddd; 
box-shadow: 5px 5px 5px #dddddd; 

http://jsfiddle.net/zCTC8/2/

Todo lo que hice fue esencialmente ajustar el color de valor de la sombra, que es el último valor de la declaración (#dddddd, o #ddd). Estos son valores hexadecimales Vea aquí más ejemplos:

http://html-color-codes.com/

#ddd/#dddddd representa un color gris claro; #eee es más claro, #ccc es más oscuro, #fff es blanco y #000 es negro. El valor #000 representa RGB, con valores válidos de 0-9A-F (obscuro> luz), de manera que:

#f00 = red (R) 
#0f0 = green (G) 
#00f = blue (B) 

El valor #99CCFFfrom your question es equivalente a #9CF, lo que da un rojo medio (9), un verde claro (C) y blanco (F). La combinación de estos valores te da el tono azul claro que estabas viendo, por lo que obtuviste un color en lugar de un color "similar a una sombra" (tono gris).

Mi teoría del color está un poco oxidada aquí, por lo que cualquier persona me corrige si he fallado algo.

Answer 2

Si quieres un dropshadow con un nivel de opacidad, se debe utilizar RGBA() por su color de la sombra:

http://css-tricks.com/2151-rgba-browser-support/

edición:

-moz-box-shadow:5px 5px 5px rgba(0,0,0,0.3); 
-webkit-box-shadow:5px 5px 5px rgba(0,0,0,0.3); 
box-shadow:5px 5px 5px rgba(0,0,0,0.3);