css - solo - la pantalla de mi iphone se ve opaca

¿Cómo evitar el ajuste automático de tamaño de fuente de iOS?

Question

No estoy hablando de hacer zoom en la página, sino más bien de cómo MobileSafari en iOS aumenta automáticamente el tamaño de algunas fuentes a veces.

¿Cuándo, exactamente, se hace esto? ¿Se puede prevenir o desalentar?

Answer 1

La respuesta aceptada funciona, pero en otros navegadores de webkit bloquea el font-size de font-size para las personas que utilizan el zoom. Usar 100% lugar de ninguno funciona en ambos sentidos:

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

Answer 2

Tuve muchos problemas para rastrearlo, pero: es la -webkit-text-size-adjust en CSS.

developer.apple.com/library/safari/#documentation/… .

Valores:

• Porcentaje (del tamaño predeterminado), por ejemplo, 120% o 100%
• auto (predeterminado)
• none - si el auto no funciona para su página. Sin embargo, esto a menudo causa problemas con el zoom. Use 100% lugar. Por ejemplo, abra Safari en su escritorio y amplíe la página (Command-Plus): su texto no se ampliará, ¡aunque la página entera haya aumentado! ¡No use none !

Tenga en cuenta que estos pueden aplicarse no solo en el nivel de página, sino también en el nivel elemento / widget / contenedor.

(No solo especificaría un valor de 100% para mi sitio web a menos que estuviera absolutamente seguro de que ya estaba optimizado para pantallas pequeñas, y nunca none ya que causa problemas).

Tenga en cuenta que en Firefox Mobile (por ejemplo, para Android y Firefox OS) hay una propiedad similar, -moz-text-size-adjust , developer.mozilla.org/en-US/docs/CSS/text-size-adjust . Gracias a Costa por señalar esto.

Al parecer, Microsoft también tiene una versión de esto para IE móvil: -ms-text-size-adjust .

Answer 3

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

Solo asegúrate de que todo tu texto tenga un tamaño legible desde el principio. El iPhone y el iPod touch tienen una pantalla bastante pequeña, así que tenlo en cuenta también.