Stile, die nicht in Gmail
Arbeite ich an E-Mails an verschiedene E-Mail-clients(wie yahoo,hotmail,gmail,....).
Ich habe ein div mit der id OrderInfo
im inneren, dass ich eine variable, erzeugt eine dynamische Tabelle.
HTML
<div id="OrderInfo">
variable
</div>
Den dynamischen Tabelle generiert Header(th
) mit Kleinbuchstaben, also ich möchte das ändern in Großbuchstaben und einige weitere styling. So habe ich geschrieben-Selektoren
CSS
#OrderInfo table tr th {
text-transform: uppercase;
background-color: #737373;
color: white;
}
Ist dies funktioniert gut für yahoo, hotmail aber nicht für gmail.
Stieß ich auf, dass nur inline-styles arbeiten für gmail, aber wie kann ich die styles ändern, um eine dynamische.
Habe ich keinen Einfluss auf die variable (erwähnte ich im div) es erzeugt eine Tabelle mit Werten, welche Prozesse beim senden an den client.
So, ich kann nicht halten Sie eine statische Tabelle und kann nicht ändern die Art und Weise macht es
- fügen Sie inline-css.
- können wir schreiben, inline-Selektoren?
Du musst angemeldet sein, um einen Kommentar abzugeben.
gmail sowie einige andere web-und desktop - /mobile-clients entfernt css-stylesheets entweder importiert oder eingebettet in eine
<style>...</style>
Knoten in derhead
Setzen Sie inline:
Mehr als eine Allgemeine Beratung: Gebäude E-Mail html ist nicht trivial, wie das Finale Ergebnis kann sehr unterschiedlich sein, je nach der recipient E-mail-client.
Die Allgemeine Regel ist, um die html so einfach wie möglich, Vermeidung von "modernen" css-Funktionen; verwenden Sie verschachtelte Tabellen statt divs, wenn möglich (einige sagt, bauen den html-Code als wenn man ein Gebäude vor 15 Jahren-Webseite).
Oben ist sehr allgemein und vielleicht nicht immer wahr.
Gibt es mehrere online-Ressourcen, die gibt Ratschläge und Regeln auf, wie man eine html-E-Mail oder Vorlage.
Schließlich nur eine Regel, die zu befolgen Sie stets, wenn Sie sicher sein möchten, das Ergebnis: testen Sie Ihre Nachrichten mit verschiedenen client -
<td>
element - oder was auch immer element braucht, um gestylt.UPDATE 2018
GMAIL heute und von vor einer Weile wurde die Unterstützung eingebettet CSS verwenden, so können Sie CSS-innen-tag
<style>
imhead
es sogar erlauben/unterstützt die Verwendung von media queries.ALTE ANTWORT
Gmail unterstützt keine eingebetteten CSS, müssen Sie die Verwendung von inline-styles, werfen Sie einen Blick auf dieses12 Dinge, die Sie Wissen MÜSSEN bei der Entwicklung von E-Mails für Gmail und Gmail Mobile Apps
Hier ist, was Sie tun könnten:
<th bgcolor="#737373" style="text-transform: uppercase; color:white></th>
Viele E-Mail-service zu bieten keine Unterstützung für css in E-Mail-Vorlage. Stattdessen verwenden Sie inline-css.
Auch E-Mail-Vorlage sollte gebildet werden unter Verwendung von Tabellen, wie es unterstützt nur HTML3. Sie können HTML4/5-Elementen innerhalb
td
tagsDo-check -dieser link. Es wird Ihnen helfen, E-Mail-Vorlage.
Versuchen Sie es mit diesem styling macht Ihr link rot mit keinen besonderen Effekt für den hover-situation:
Dies funktioniert gut für mich, aber wenn jemand von den 4 Aussagen fehlen, wird es nicht funktionieren, weder in einem gmail-client, noch in Outlook. Sie müssen auch in der Reihenfolge angezeigt, die oben gezeigt werden.