2011-01-14 6 views
11

Ich erstelle eine E-Mail-Vorlage, die Bilder von einer externen Website anzeigen muss. Ich hatte einige Tags zum Rendern der Bilder platziert und es gibt einige <td> Tags mit Hintergrund-Image-Eigenschaft in Inline-CSS der Elemente festgelegt.HTML-E-Mail mit Hintergrund-Bild-Stil nicht gezeigt

Wenn eine E-Mail in Outlook empfangen wird, werden die Bilder nicht angezeigt (dies wird erwartet, da die Bilder nicht eingebettet sind). Und ich klicke auf die Download-Bilder, um die Bilder richtig zu sehen. Die Bilder in <IMG> Tag werden nur angezeigt und das Hintergrundbild für die <TD> wird nicht gerendert.

Irgendwelche Ansichten zur Lösung dieses Problems?

Danke!

+0

Wie genau stellen Sie die Eigenschaft Hintergrundbild? – amosrivera

+0

td style = "Hintergrundbild: URL (http: //mysite/images/common/msg_collapsed_title_bg.png); Hintergrundwiederholung: Wiederholungs-x" – Chaitanya

Antwort

7

Endlich fand ich die Antwort.

Outlook 2007 verwendet die Render-Engine von Internet Explorer nicht zum Laden von HTML-Inhalt. Stattdessen werden Word 2007-HTML- und CSS-Funktionen verwendet.

Aus diesem Grund CSS-Attribute wie Hintergrundbild wird nicht unterstützt. Daher ist es nicht möglich, ein Hintergrundbild für HTML-Elemente in Outlook mithilfe von Standard-CSS-Tags festzulegen.

Weitere Daten ist bei http://msdn.microsoft.com/en-us/library/aa338201(v=office.12).aspx

4

Hintergrundbilder verfügbar sind nicht in Outlook unterstützt. Als bewährte Methode sollten Sie niemals Hintergrundbilder in HTML-E-Mails verwenden. Wenn Sie einen Hintergrund haben müssen, können Sie PLUS als Volltonfarbe verwenden. Diejenigen mit E-Mail-Clients, die Hintergrundbilder unterstützen, erhalten die Bilder, und diejenigen, die sie nicht unterstützen, fallen auf die Volltonfarbe zurück.

4

Es gibt tatsächlich eine Methode, um Hintergrundbilder in HTML-E-Mails in Outlook zu verwenden.

Wie Chaitanya erwähnt, kann es nicht mit CSS gemacht werden, aber es kann über VML erfolgen.

Die Technik ist ein wenig komplizierter als die Verwendung background: url(....) und ich verwende es nicht so häufig wie ich die CSS-Technik verwenden würde (wenn es in Outlook funktionierte). Aber es ist sehr nützlich.

Ich habe es erfolgreich für eine Reihe von Kampagnen verwendet.

Vollständige Anweisungen hier: einschließlich einer Liste von E-Mail-Clients, die diese Technik unterstützen.

http://www.campaignmonitor.com/forums/viewtopic.php?pid=14197

0

Es gibt einen Weg HTML-Bilder darstellen kann.

Right HTML-E-Mails als MS Word-Dokument in Outlook gerendert.

Ich habe die Lösung von dieser https://stackoverflow.com/a/12693917/413032 Post.

Also brauchen wir eine Alternative.

In der Tat können Sie Ihre HTML-E-Mail in MSWORD öffnen und finden, was scheint falsch und in Anbetracht dessen, was eine Alternative sein kann gibt eine Idee.

Hier ist was ich getan habe;

  1. Added v Namespace HTML-Tag

    < html xmlns:v="urn:schemas-microsoft-com:vml" 
    
  2. Added v ‚s Stil Kopfblock

    <head> 
    <style type="”text/css”"> 
         v\:* { behavior: url(#default#VML); display:inline-block} 
    </style> 
    
  3. In Tabelle oder wo Sie hinzufügen müssen Ihre MSWord alternative

    <table style="background-image: url('https://e-telesaglik.com/images/email/canvas-bg.jpg');background-repeat:no-repeat;" cellpadding="0" width="960"> 
          <!--[if gte vml 1]> 
            <v:shape 
             stroked='f' 
             style='position:absolute;margin-left:-90pt;margin-top:-1.55pt;  
               z-index:-503306481; 
               visibility:visible; 
               width:720pt; 
               height:475pt;   
               top:0; 
               left:0; 
               border:0;            
               '> 
             <v:imagedata src="https://e-telesaglik.com/images/email/canvas-bg.jpg"/> 
            </v:shape> 
          <![endif]--> 
           <tbody> .... 
    

Das ist alles. Sicher wird es ein MSWord Render sein. Und mehr, wie Sie bemerken, verwenden wir absolute Positionierung ...

Wie auch immer, das ist eine Problemumgehung und löst das Problem in gewisser Weise. Wir hoffen, dass MS-Outlook eines Tages HTML-E-Mails mit einem Webbrowser nicht mit MS-Word rendert.

0

Dies funktioniert in Google Mail,

ich dieses div in E-Mail-Newsletter mit Bild zu zeigen versucht, versuche inline css, das Senden von E-Mail-Richtlinien here