2012-10-16 17 views
16

Niedawno tworzyłem biuletyn dla mojego klienta. Jakkolwiek nie mogę znaleźć dobrych informacji na temat tego, które css i html są bezpieczne w użyciu w głównych klientach pocztowych.Jakie atrybuty html/css są bezpieczne pocztą?

Pomyślałem, że być może są tu ludzie, którzy mają wiedzę i możemy stworzyć listę rzeczy, które działają na głównych klientach pocztowych.

To jest lista popularnych klientów pocztowych, których pożyczyłem od monitora kampanii. (Jeśli zapomniałem somthing chcę)

Microsoft Outlook 
Apple Mail 
Hotmail 
Yahoo! Mail 
Gmail 

Pytanie brzmi co, atrybuty specjalne dziwactwa są znaczniki tam w tych głównych przeglądarek i jak można je łatwo uniknąć.

Dzięki za pomoc,

Odpowiedz

6

można znaleźć pełną listę obsługiwanych i nieobsługiwanych Funkcje CSS dla wszystkich głównych klientów poczty e-mail pod numerem Email Standard Project

Naprawdę bootstrap przydatna dla rozwoju e-maili w formacie HTML, która ma mnóstwo eliminatory rozbieżność HTML Email Bolerplate

A co do zasady - zawsze korzystać z tabel i wszystkie znaczniki HTML starej szkoły (align, center, valign, color itd.). Niektóre reading na temat.

0

Gmail już obsługuje znacznika w głowie

Można użyć podzbiór selektorów CSS zastosować style style. Gmail obsługuje selektory klasy, elementu i identyfikatora .

<html> 
    <head> 
    <style> 
     .colored { 
     color: blue; 
     } 
     #body { 
     font-size: 14px; 
     } 
    </style> 
    </head> 
    <body> 
    <div id='body'> 
     <p>Hi Pierce,</p> 
     <p class='colored'>This text is blue.</p=> 
     <p>Jerry</p> 
    </div> 
    </body> 
</html> 

i zapytań mediów:

Można używać standardowych zapytań o media CSS, aby dostosować stylizacji e-mail, aby dostosować bieżące urządzenie użytkownika.Gmail obsługuje kwerendy w zakresie szerokości, orientacji i rozdzielczości ekranu.

<html> 
    <head> 
    <style> 
     .colored { 
     color: blue; 
     } 
     #body { 
     font-size: 14px; 
     } 
     @media screen and (min-width: 500px) { 
     .colored { 
      color:red; 
     } 
     } 
    </style> 
    </head> 
    <body> 
    <div id='body'> 
     <p>Hi Pierce,</p> 
     <p class='colored'> 
     This text is blue if the window width is 
     below 500px and red otherwise. 
     </p> 
     <p>Jerry</p> 
    </div> 
    </body> 
</html>