1. Inicio
  2. Pregunta y respuesta
  3. Android Browser cambia el tamaño del texto automáticamente

Android Browser cambia el tamaño del texto automáticamente

2012-06-10 14 views
5

Tengo un proyecto que muestra fuente de texto de 16px en 0.5ems enlaces en el iPhone perfectamente bien.Android Browser cambia el tamaño del texto automáticamente

Sin embargo, cuando cambio a un navegador Android, la fuente de texto se agranda y mi ubicación de los enlaces se atornilla.

Mis enlaces están en un comunicado

<p><a>[Link]</a></p>

.

¿Hay alguna manera de evitar que el texto de Android cambie el tamaño de sí mismo? ¿O hay una mejor solución para esto?

EDIT:

me he dado cuenta de que el navegador Android no permite el desplazamiento automático también. ¿Por qué esto es tan? ¿No son los navegadores iPhone y Android que utilizan webkits como base? ¿Por qué son tan diferentes a pesar de que usan la misma tecnología? ¿Hay algún atributo adicional que deba declarar en CSS para que funcione de la misma manera que la contraparte de Safari?

Fuente

2012-06-10 Kyle Yeo

+0

Me di cuenta de que el navegador de Android no permite el desplazamiento automático también. ¿Por qué esto es tan? ¿No son los navegadores iPhone y Android que utilizan webkits como base? ¿Por qué son tan diferentes a pesar de que usan la misma tecnología?¿Hay algún atributo adicional que deba declarar en CSS para que funcione de la misma manera que la contraparte de Safari? –

+0

¿Puedes mostrar las pantallas graficas de ambos, Android y Phone, para ver realmente la diferencia? :) –

+0

hmm, ¿cómo puedo imprimir en Android? –

Respuesta

3

tuve un problema similar también. Tenía un diseño diseñado específicamente para la pantalla de Retina, pero la pantalla de la retina tiene una densidad de píxeles de 2, por lo que un píxel no es necesariamente un píxel (ancho de píxel del iphone no retina: 320 píxeles, retina: 640 píxeles).

Para arreglar eso, puse esto en el <head>: <meta name='viewport' content='width=device-width, initial-scale=.5, maximum-scale=.5'> para que un teléfono normal se escale como esperaba, y la pantalla retina se escalaría apropiadamente (media escala).

No estoy seguro de qué tipo de diseño está utilizando, pero jugaría con la escala inicial y la escala máxima, pruebe tanto .5 como 1 y vea lo que obtiene.

Fuente

2012-06-18 20:40:28 LOLapalooza

+0

Tal vez no sea tan extraño dados los valores en el atributo, pero esto cortó la ventana gráfica a la mitad para mí en iOS y Android, la parte izquierda de la página se ve igual, pero el lado derecho está en blanco :) –

2

Si usa píxeles (px), está relacionado con la densidad de píxeles de la pantalla. Una pantalla de "retina" de iPhone mostraría el texto de forma diferente a su dispositivo Android.

Este artículo trata el tema bastante bien: http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/

Fuente

2012-06-10 05:28:09

+0

Lo que pasa es que solo tengo ese elemento px en mi cuerpo. el resto de mis consultas multimedia css están todas en ems. ¿esa única px afecta el resto? He intentado cambiar el tamaño, pero sigue siendo el mismo. –

+0

@RenoYeo Hmm. El apéndice de esa publicación que he vinculado sugiere utilizar un porcentaje (%) para el tamaño de fuente del elemento del cuerpo, en lugar de píxeles (px). Hacerlo debería significar que las cosas se escalan muy bien independientemente del tamaño de la pantalla. ¿Ayuda? –

+0

entonces el 100% es en realidad 16px, ¿verdad? Voy a intentar, y decirte cómo va –

2

He encontrado una configuración que podría ayudar en otra pregunta, Font size rendering inconsistencies on an iPhone:

body { 
    -webkit-text-size-adjust: 100%; 
}

un valor alternativo se describe en otra pregunta, Font size issue with iPhone:

html { 
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */ 
}

Parece que uno de ellos pueda impedir la navegador de Android de redimensionamiento. Espero que esto ayude.

Fuente

2012-06-18 21:46:19 trebormf

Cuestiones relacionadas

 Cuestiones relacionadas