Perché font-size CSS non funziona su email HTML iPad?

StackOverflow https://stackoverflow.com/questions/3403451

  •  25-09-2019
  •  | 
  •  

Domanda

Sto lavorando a una e-mail HTML e sono stato in esecuzione per un problema sul client di posta elettronica su iPad solo.

Sembra che l'impostazione CSS in linea in "font-size: 12px" o qualsiasi altro formato non funziona su l'applicazione Posta per iPad, nonostante la font-size corretta visualizzazione in app Mail per Mac OS X

Tutte le idee?

È stato utile?

Soluzione

Webkit regola automaticamente di font-dimensioni sul iPad per una facile lettura. Questo CSS risolve il problema: 

-webkit-text-size-adjust: none;

Altri suggerimenti

Il motore di layout regola automaticamente WebKit di font-dimensioni.
partire da questo post, Webkit è comunemente usato in Safari, Chrome, Kindle e Palm Browser .
Le applicazioni possono inoltre usufruire di WebKit.

Il problema si riduce a minima 'font-size: 13px;'

A CSS work-around:
<style type="text/css">
div, p, a, li, td { -webkit-text-size-adjust:none; }
</style>

Un problema è quando si crea e-mail firme, per i tag possono essere sovrascritti o spogliato.
Si prega di notare che in linea WebKit Styling sarà spogliato di Web Client di Gmail.

testo vuol sostenere che compongono stile? (Cioè, grassetto, corsivo, dimensioni dei caratteri) No (confermato), a parte qualsiasi formattazione riportati per copia-e-incolla da Safari o altre applicazioni. (Supporta sicuramente la visualizzazione HTML ricche messaggi di testo /.)

http://www.macintouch.com/reviews/ipad/faq.html 

<head>

<style type="text/css">
<!--

/*
    I began with the goal to prevent font scaling in Landscape orientation.
    To do this, see: http://stackoverflow.com/questions/2710764/

    Later, I just wanted to magnify font-size for the iPad, leaving
    the iPhone rendering to the css code.  So ...

    (max-device-width:480px) = iphone.css
    (min-device-width:481px) and
        (max-device-width:1024px) and
            (orientation:portrait) = ipad-portrait.css
    (min-device-width:481px) and
        (max-device-width:1024px) and
            (orientation:landscape) = ipad-landscape.css
    (min-device-width:1025px) = ipad-landscape.css

*/

@media only screen and (min-device-width: 481px)
{
    html {
        -webkit-text-size-adjust: 140%;
    }
}

-->
</style>

</head>
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top