Heim > Artikel > Web-Frontend > Wie erstelle ich abgerundete Ecken in Outlook-E-Mails ohne Bilder?
Das Erstellen abgerundeter Ecken in E-Mail-Clients kann mithilfe von CSS ganz einfach sein. Allerdings funktioniert die herkömmliche Methode zur Verwendung der CSS-Eigenschaft „border-radius“ in Microsoft Outlook nicht. Diese Einschränkung stellt beim Entwerfen von E-Mails mit Elementen mit abgerundeten Ecken eine Herausforderung dar.
Keine Angst, es gibt eine Lösung, mit der Sie in Outlook abgerundete Ecken erzielen können, ohne auf die Verwendung von Bildern zurückgreifen zu müssen. Der Schlüssel liegt in der Nutzung der bedingten Kommentare von Outlook und VML (Vector Markup Language).
<!--[if mso]> <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://www.EXAMPLE.com/" style="height:40px;v-text-anchor:middle;width:300px;" arcsize="10%" stroke="f" fillcolor="#d62828"> <w:anchorlock/> <center style="color:#ffffff;font-family:sans-serif;font-size:16px;font-weight:bold;"> Button Text Here! </center> </v:roundrect> <![endif]--> <!--[if !mso]> --> <!--<![endif]-->
Dieser Code erzeugt Schaltflächen mit abgerundeten Ecken in Outlook 2010. Er nutzt die bedingten Kommentare von Outlook, um gezielt auf Outlook abzuzielen und den VML-Code anzuwenden . Der VML-Code selbst definiert die abgerundete rechteckige Form und ihre Attribute wie Farbe und Text.
Beachten Sie, dass diese Lösung in Outlook 2010 und den wichtigsten Browsern getestet wurde, jedoch nicht in OWA, Outlook.com oder mobilen Browsern . Es ist immer ratsam, Ihren Code auf verschiedenen Plattformen zu testen, um die Kompatibilität sicherzustellen.
Das obige ist der detaillierte Inhalt vonWie erstelle ich abgerundete Ecken in Outlook-E-Mails ohne Bilder?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!