CSS3 linear-gradient no funciona en Android.

pregunta de novato aquí, pero por alguna razón no puedo resolver esto. Tengo el siguiente CSS que funciona bien en mi iPhone pero no en mi Android. Al mirar las demostraciones de jQuery Mobile con el Android, sé que puede manejar degradados de fondo. GraciasCSS3 linear-gradient no funciona en Android.

.mydiv { 
    background: -moz-linear-gradient(#FFFFFF, #F1F1F1) repeat scroll 0 0 #EEEEEE; 
    background: -webkit-linear-gradient(#FFFFFF, #F1F1F1) repeat scroll 0 0 #EEEEEE; 
    background: linear-gradient(#FFFFFF, #F1F1F1) repeat scroll 0 0 #EEEEEE; 
}

Fuente

2012-05-10 Evans

navegador de Android por debajo de 4,0, de acuerdo con caniuse utiliza el viejo -webkit sintaxis:

background-image:-webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #a7cfdf), color-stop(100%, #23538a));

Bono: Le recomiendo que use algo así como menos o Brújula/SASS, le tomaría salvar a todos este trabajo http://compass-style.org/

Fuente

2012-05-10 15:09:48 Cmorales

¿Qué es para Android 2.2? Cada variacion he intentado doenst trabajo. Gracias – Evans

¿Qué variaciones has probado? ¿Has probado este "fondo: -webkit-gradient (lineal, izquierda arriba, abajo izquierda, color-stop (0%, # 000000), color-stop (100%, #ffffff));" ? – Cmorales

Lo probé yo mismo y solo funciona la sintaxis antigua. He editado mi respuesta. – Cmorales

background-color:#666633; //fallback 
background:-webkit-linear-gradient(top, #666633, #333300); //webkit 
background:-moz-linear- gradient(top, #666633, #333300) //mozilla

Esto funciona.

Fuente

2012-05-10 15:13:04

Obtengo un color sólido, pero de acuerdo con este sitio http://www.impressivewebs.com/css3-linear-gradient-syntax/ "El soporte móvil para degradados lineales incluye: iOS 3.2+, Opera Mini 5+, Opera Mobile 10+ y Android Browser 2.1+ ". y mi android es 2.2, así que debería funcionar. – Evans

Eso es extraño. Funciona en mi GNex con 4.0. Es realmente difícil mantenerse al día con la sintaxis de CSS3 en estos días. –

Tal vez las demostraciones de jQuery Mobile están usando imágenes de fondo, pero sin ningún tipo de cosa tipo firebug es difícil de saber. – Evans

Me encontré con esta pregunta porque tenía problemas con los gradientes lineales en un Android 2.2. El tema fue, nuestra gradiente lineal estaba usando el nuevo sistema ángulo

-webkit-linear-gradient(to top #000000 0%, #ffffff 100%)

sin embargo, mayor apoyo de Android el sistema de ángulo de edad (sin -). El equivalente del gradiente anterior sería

-webkit-linear-gradient(bottom #000000 0%, #ffffff 100%)

Fuente

2014-08-27 16:38:47 applesElmi

Agradable, funcionó para mí. – iConnor

CSS3 linear-gradient no funciona en Android.

Respuesta

Cuestiones relacionadas