HTML - Sombras HTML5 Y CSS3

 
Vista:
sin imagen de perfil

Sombras HTML5 Y CSS3

Publicado por Roman (2 intervenciones) el 03/02/2015 21:15:11
Estoy trabajando en una pagina web y me surgió una duda al querer ponerle sombrar a un DIV, ya que he investigado pero no logro resolver mi duda, espero me pueda ayudar, y mi duda es como puedo ponerle sombras solo a 3 partes de un div en este caso solo quiero que se le pongan sombras en la parte de arriba, izquierda y derecha mas no en la parte de abajo. Incluyo el archivo de la imagen comprimida por si me pueden ayudar, muchas gracias.
De antemano muchas gracias y disculpen la molestia.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de txema
Val: 74
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

Sombras HTML5 Y CSS3

Publicado por txema (7 intervenciones) el 04/02/2015 09:49:55
Hola Roman:

Creo que lo que quieres es (salvando los valores de píxeles y el color de la sombra) es algo parecido a esto:
1
2
3
-webkit-box-shadow : 3px -12px 6px 12px #808080 ; 
-moz-box-shadow : 3px -12px 6px 12px #808080 ; 
box-shadow : 3px -12px 6px 12px #808080 ;

Puedes "jugar" con los valores.
3px desplaza a la derecha;
-12px desplaza hacia arriba;
6px es el ancho del difuminado
12px es lo que agrando la sobra (y la extiende a la izquierda al ser mayor que 3px pero no hacia abajo porque compensa el -12px).

Si al color quieres darle diferentes grados de opacidad, sería rgba(80,80,80, 0.5 donde 0.5 sería el grado de opacidad.

Nos cuentas
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil

Sombras HTML5 Y CSS3

Publicado por Roman (2 intervenciones) el 04/02/2015 17:12:52
Hola, muy buenos días, antes que nada muchísimas gracias por tu ayuda, me ha funcionado de maravilla, gracias por compartir tus conocimientos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar