Nessun stilo CSS visto in e-mail
-
20-12-2019 - |
Domanda
Non riesco a vedere gli stili CSS quando la seguente pagina HTML viene inviata via email (Yahoo / Gmail) utilizzando Mutt.i vedi solo un tavolo semplice. Maggio che ricevo lo stile desiderato quando lo ha visto in un browser.Perchè è così ?Mi manca qualcosa?
mutt -e "set content_type=text/html" me@mail.com -s "Test" < Test.html
.
Test.html
<!DOCTYPE html>
<html>
<head>
<style>
rd{ color: red; }
gn{ color: green; }
body { background-color:#E0E0E0; font-family: helvetica;font-size: 15px;}
</style>
</head>
<body>
<table border="1" align ="left">
<tr><th>No.</th><th>Item</th></tr>
<tr><td>1</td><td><gn>abc</gn></td></tr>
<tr><td>2</td><td><rd>ghi</rd></td></tr>
</table>
</body>
</html>
. Soluzione
HTML-Email è molto limitato al punto in cui anche tag Div e P non agiscono sempre come previsto.Cercando di creare i tuoi tag ti sta semplicemente chiedendo problemi.
Le tue due cellule da tavolo dovrebbero sembrare così:
<tr><td>1</td><td style="font-family: Helvetica, Arial, sans-serif; font-size: 15px; color:#007700;">abc</td></tr>
<tr><td>2</td><td style="font-family: Helvetica, Arial, sans-serif; font-size: 15px; color:#770000;">ghi</td></tr>
.
Oltre a inlineare sempre il tuo CSS, è necessario utilizzare il colore esagonale a 6 cifre per il massimo supporto client di posta elettronica.Devi anche ri-dichiarare i tuoi stili dei font in ogni cella da tavolo.Sfortunatamente così com'è, purtroppo questo è ciò che è necessario in HTML-e-mail.
Non dimenticare anche la pila di carattere, come stai attualmente assumendo che il lettore abbia installato Helvetica.
Altri suggerimenti
Il modo per includere CSS in un'e-mail HTML è utilizzare gli stili in linea.
<!DOCTYPE html>
<html>
<body style='background-color:#E0E0E0; font-family: helvetica;font-size: 15px;'>
<table border="1" align="left" style="color:red;">
<tr><th>No.</th><th>Item</th></tr>
<tr><td>1</td><td><gn>abc</gn></td></tr>
</table>
</body>
</html>
.
Rif: http://www.htmlgoodies.com/beyond/css/Articolo.php / 3679231
Potrebbe essere necessario dare un'occhiata a questo tutorial Guida introduttiva con le e-mail HTML su tutsplus Questo è un vecchio tutorial ma davvero utile.
buona fortuna.