Foros del Web » Creando para Internet » CSS »

No logro aplicarle un gradiente a un background-image

Estas en el tema de No logro aplicarle un gradiente a un background-image en el foro de CSS en Foros del Web. Buenas, Resulta que estoy teniendo problemas en aplicarle un gradient top transparent-white a una imagen de fondo, de manera que se pueda visualizar el fondo ...
  #1 (permalink)  
Antiguo 24/02/2016, 08:32
 
Fecha de Ingreso: febrero-2016
Mensajes: 17
Antigüedad: 8 años, 2 meses
Puntos: 0
No logro aplicarle un gradiente a un background-image

Buenas,

Resulta que estoy teniendo problemas en aplicarle un gradient top transparent-white a una imagen de fondo, de manera que se pueda visualizar el fondo desde arriba con el transparent y se vaya difuminando a blanco.

El código que tengo es éste, y al cargar la página me sale la imagen sin el gradiente. No sé que puedo estar haciendo mal.

Código CSS:
Ver original
  1. body{
  2.            
  3. background-repeat: no-repeat;
  4.  
  5. background-attachment: fixed;
  6.  
  7. background-position: center;
  8.  
  9. background-size: cover;
  10.  
  11. background-color: rgba(255,255,255,0);
  12.  
  13. background-image: url('image.jpg');
  14.  
  15. background-image: url('image.jpg'), -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
  16.  
  17. background-image: url('image.jpg'), -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
  18.  
  19. background-image: url('image.jpg'), linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  20.  
  21. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
  22.  
  23. }

Muchas gracias de antemano, Por cierto, la imagen tiene una resolución de 1200x600px.

Última edición por pzin; 25/02/2016 a las 05:16 Razón: highlight código

Etiquetas: background, background-image, color
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:07.