it-swarm.com.de

Wie entferne ich Links, die in meiner HTML-E-Mail unterstrichen sind?

<td width="110" align="center" valign="top" style="color:#000000;">
    <a href="https://example.com" target="_blank"
       style="color:#000000; text-decoration:none;">BOOK NOW
    </a>
</td>

Ich habe diesen Code verwendet, um in meiner HTML-E-Mail einen Link zu erstellen. In Browsern und Outlook funktioniert es gut, aber in GMail, Hotmail und Ymail werden Links unterstrichen angezeigt.

Kann mir jemand helfen, das loszuwerden?

21
pubudumj
<a href="#" style="text-decoration:none !important; text-decoration:none;">BOOK NOW</a>

Outlook entfernt den Stil mit dem !important-Tag und verlässt den regulären Stil, also keine Unterstreichung. Mit dem !important-Tag wird der Standardstil der webbasierten E-Mail-Clients festgelegt, sodass keine Unterstreichung erfolgt.

27
Nathaniel Hoyt

Ich sehe das wurde beantwortet; Ich bin jedoch der Meinung, dass dieser Link geeignete Informationen enthält, welche Formatierungen in verschiedenen E-Mail-Clients unterstützt werden.

http://www.campaignmonitor.com/css/

Es ist erwähnenswert, dass GMail und Outlook zwei der klügsten sind, um HTML-E-Mails zu formatieren.

7
Kennith Nichol

Ich denke, wenn Sie dem <a>-Tag mit text-decoration:none einen span-Stil hinzufügen, funktioniert es in der Mehrzahl der Browser/E-Mail-Clients.

Wie in:

<a href="" style="text-decoration:underline">
    <span style="color:#0b92ce; text-decoration:none">BANANA</span>
</a>
2
Ricardo

Eine andere Möglichkeit, Google Mail zu täuschen (für Telefonnummern): Verwenden Sie eine ~ anstelle eines -

404-835-9421 -> 404 - 835 - 9421

Das erspart Ihnen (oder weniger versierten Benutzern) die Reise in die HTML-Spur.

Ich habe einen anderen Weg gefunden, Links in Outlook zu entfernen, die ich bisher getestet habe. Wenn Sie beispielsweise eine leere Klasse in Ihrer CSS-Datei erstellen, sagen Sie .blank {} und führen Sie dann zum Beispiel Folgendes aus:

<a href="http://www.link.com/"><span class="blank" style="text-decoration:none !important;">Search</span></a>

das hat für mich geholfen, hoffentlich wird es jemandem helfen, der immer noch Probleme hat, die Unterstreichung von Links in Outlook herauszunehmen. Wenn jemand eine Problemumgehung für Google Mail hat, könnten Sie mir helfen, alles in diesem Thread auszuprobieren, dass nichts funktioniert.

Vielen Dank

2

Verwenden Sie! Wichtig in der Textdekorationsregel. <a href="#" style="text-decoration:none !important;"> JETZT BUCHEN </a>

2
TechyTee

Nach einem halben Tag (und zwei Jahren seit Eröffnung dieser Frage) habe ich eine umfassende Antwort darauf gefunden.

<a href="#"><font color="#000000"><span style='text-decoration:none;text-underline:none'>Link</span></font></a>

(Sie benötigen die Textunterstricheigenschaft im Bereich innerhalb des Links und das Schriftart-Tag, um die Farbe zu bearbeiten.)

2

Ich habe beide Deklarationen in der a href hinzugefügt, die in Outlook- und Google Mail-Apps funktioniert. Outlook ignoriert das! Wichtige und Google Mail braucht es. Webversionen von E-Mails funktionieren mit beiden.

text-decoration: none !important; text-decoration: none;
1
Steven Collins

Ich habe eine Kombination verwendet, bei der keine Links in Google angezeigt wurden, Links für MSO (Outlook) und das schüchterne Tag hinzugefügt wurden, um das Erscheinungsbild und das Gefühl für mein Unternehmen zu erhalten. Ein Teil des Codes kann überflüssig sein (für meine Firma ist das Aussehen wichtiger als der anklickbare Teil. (Es fühlte sich an wie ein Puzzle, da jede Änderung etwas anderes bremst).

<td style="color:rgb(69, 54, 53)">
<!--[if gte mso 9]>
<a href="http://www.immothekerfinotheker.be" style="text-decoration:none;">
<span style="text-decoration:none;">
<![endif]-->
www&shy;.&shy;immothekerfinotheker&shy;.&shy;be
<!--[if gte mso 9]>
</a>
</span>
<![endif]-->
</td>

Hoffe das hilft jemandem

1
Tom Leppens

Unterstrichene Unterstreichung für <a> sowohl in der E-Mail-Anwendung als auch im Webbrowser kann auf folgende, schwierige Weise erfolgen.

<a href="..."><div style="background-color:red;">
    <span style="color:red; text-decoration:underline;"><span style="color:white;">BUTTON</span></span>
</div></a>
  1. Die Farbe in 1st <span> ist diejenige, die Sie nicht benötigen.MUSSals Hintergrundfarbe eingestellt werden. (rot hier)

  2. Die Farbe in 2. <span> ist diejenige für den Schaltflächentext. (weiß hier)

1
Jeffrey Neo

Alle E-Mail-Clients passen den von Ihnen angegebenen HTML- und CSS-Code nach ihren eigenen Regeln an:

Beispiel: gmail entfernt alles außer dem inneren HTML-Code des body-Tags .

1. Für die meisten anderen Clients können Sie ein Style-Tag in Ihrer Kopfzeile haben

<style type="text/css">
    a {text-decoration: none !important;}
</style>

Hinweis: Verwenden Sie keine CSS-Kommentare, da YAHOO! Mail Probleme verursachen kann.

2. Um auf der sicheren Seite zu sein, fügen Sie den gleichen Code inline in das A-Tag ein, wie Sie es getan haben, sowie ein zusätzliches span-Tag (die Stilregeln in einem Tag werden häufig entfernt).

<a href="" style="text-decoration: none !important;">
    <span style="text-decoration: none !important;">
        text
    </span>
</a>
1
retrovertigo

Sie können "redundantes Styling" ausführen, und das Problem sollte behoben sein. Sie verwenden dasselbe Styling, das Sie für das haben, fügen Sie es jedoch einem hinzu, der sich innerhalb des befindet.

Beispiel:

<td width="110" align="center" valign="top" style="color:#000000;">
    <a href="https://example.com" target="_blank"
       style="color:#000000; text-decoration:none;"><span style="color:#000000; text-decoration:none;">BOOK NOW</span></a>
</td>
0
Tom

Es hängt vollständig vom E-Mail-Client ab, ob er die Unterstreichung unter dem Link anzeigen möchte oder nicht. Ab sofort werden die Stile im Körper nur unterstützt von:

  • Ausblick 2007/10/13 +
  • Ausblick 2000/03
  • Apple iPhone/iPad
  • Outlook.com
  • Apple Mail 4
  • Yahoo! Mail Beta

http://www.campaignmonitor.com/css/

0
Anshu Dwibhashi

Code wie die folgenden Zeilen funktionierte für mich in Gmail Web Client. In der E-Mail wurde ein nicht unterstrichener schwarzer Link angezeigt. Ich habe das verschachtelte span-Tag nicht verwendet.

<table>
  <tbody>
    <tr>
        <td>
            <a href="http://hexinpeter.com" style="text-decoration: none; color: #000000 !important;">Peter Blog</a>
        </td>
    </tr>
  </tbody>
</table>

Hinweis: Google Mail entfernt falsche Inline-Stile. Z.B. Bei Code wie in der Zeile darunter werden alle Inline-Styles entfernt.

<a href="http://hexinpeter.com" style="font-family:; text-decoration: none; color: #000000 !important;">Peter Blog</a>
0
hexinpeter

In http://www.campaignmonitor.com/css/ ist eine nette Erklärung zu sagen, dass dies eingeschränkt ist! Und ein ziemlich schöner Leitfaden, um alle Einschränkungen von CSS in E-Mail-Clients kennenzulernen.

0
Exception

In Windows 10 Mail müssen Sie diese möglicherweise in Ihrem HTML-Kopf hinzufügen:

<!--[if (mso)|(mso 16)]>
  <style type="text/css">
    body, table, td, a, span { font-family: Arial, Helvetica, sans-serif !important; }
    a {text-decoration: none;}
  </style>
<![endif]-->

Das 'a {text-decoration: none;}' hat die Probleme mit der Unterstreichung behoben :)

0

Während Sie die HTML-E-Mail anzeigen, überprüfen Sie das Element in diesem Link und sehen Sie, was es überschreibt. Verwenden Sie diese Klasse und definieren Sie diesen Stil erneut in Ihrem Kopfstil und definieren Sie die Textdekoration: none! Important;

In meinem Fall sind dies die Klassen, die meinen Inline-Stil überschreiben, also auf dem Kopf meiner HTML-E-Mail angegeben und den Stil definiert, den ich implementieren möchte. 

Es hat für mich funktioniert, ich hoffe, es wird auch bei Ihnen funktionieren.

.ii a[href]{
text-decoration: none !important;
}

#yiv8915438996 a:link, #yiv8915438996 span.yiv8915438996MsoHyperlink{
text-decoration: none !important;
}   

#yiv8915438996 a:visited, #yiv8915438996 span.yiv8915438996MsoHyperlinkFollowed{
text-decoration: none !important;
}   
0
vonnshy

- INFORMATIONEN VON FERN ENTFERNT--

alles, was Sie zu tun haben; 

<a href="" style="text-decoration:#none; letter-spacing: -999px;">

0
Ömer Doğan

Verwenden Sietext-decoration:none !important;anstelle vontext-decoration:none;, um sicherzustellen, dass Sie die Unterstreichung "verlieren".

0
user1647234

Ich kopierte meine HTML-Seite und fügte sie in Word ... ein. Die Signatur in Word wurde gelöscht. Dabei wurden die Leerzeichen gelöscht, in denen die Unterstreichung platziert ist, und die Leertaste "Padding" wird erstellt. .Er arbeitete gut für mich.

0
Ewerton

Textdekoration keiner hat für mich nicht funktioniert, dann habe ich in Outlook eine E-Mail gefunden, die keine Zeile hatte, und den Code überprüft:

<span style='font-size: 12px; font-family: "Arial","Verdana", "sans-serif"; color: black; text-decoration-line: none;'>
<a href="http://www.test.com" style='font-size: 9.0pt; color: #C69E29; text-decoration: none;'><span>www.test.com</span></a>
</span>

Dieser arbeitet für mich.

0