Modèles de conception vos e-mails en HTML et de le rendre compatible avec les principaux lecteurs e-mail standard. Le Guide de la CSS, comprend de petites variations parmi les lecteurs e-mail.
Nous avons préparé ce guide pour gagner du temps, avec des différences entre les lecteurs d'e-mails couramment utilisés à partir d'applications de bureau pour les applications Web, nous allons bientôt offrir des données sur les téléphones.
Style Element | Live Hotmail |
Yahoo! |
Outlook 2007/10 |
Apple |
Google Gmail |
Lotus Notes 8.5 |
AOL 10 |
<style> in <head> | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
<style> in <body> | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Link Element | |||||||
<link> in <head> | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
<link> in <body> | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Selectors | Live Hotmail |
Yahoo! |
Outlook 2007/10 |
Apple |
Google Gmail |
Lotus Notes 8.5 |
AOL 10 |
e | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
* | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e.className | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e#id | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e:link | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e:active, e:hover | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e:first-line | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e:first-letter | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e > f | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e:focus | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e+f | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
e[foo] | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Text & Fonts | Live Hotmail |
Yahoo! |
Outlook 2007/10 |
Apple |
Google Gmail |
Lotus Notes 8.5 |
AOL 10 |
direction | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
font | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
font-family | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
font-style | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
font-variant | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
font-size | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
font-weight | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
letter-spacing | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
line-height | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
text-align | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
text-decoration | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
text-indent | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
text-overflow CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
text-shadow CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
text-transform | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
white-space | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
word-spacing | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
word-wrap CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
vertical-align | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Color & Background | Live Hotmail |
Yahoo! |
Outlook 2007/10 |
Apple |
Google Gmail |
Lotus Notes 8.5 |
AOL 10 |
color | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
background | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-moz-background CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-webkit-background CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
background-color | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
background-image | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
background-position | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
background-repeat | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-khtml-background-size CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-moz-background-size CSS3 |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-o-background-size CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-webkit-background-size CSS3 |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
HSL Colors CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
HSLA Colors CSS3 |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Opacity CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
RGBA Colors CSS3 |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Box Model | Live Hotmail |
Yahoo! |
Outlook 2007/10 |
Apple |
Google Gmail |
Lotus Notes 8.5 |
AOL 10 |
border |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-moz-border-color CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-moz-border-image CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-moz-border-radius CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-webkit-border-radius CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-moz-box-shadow CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
-moz-box-sizing CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
height | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
margin | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
padding | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
width | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Positioning & Display | Live Hotmail |
Yahoo! |
Outlook 2007/10 |
Apple |
Google Gmail |
Lotus Notes 8.5 |
AOL 10 |
bottom | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
clear | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
clip | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
cursor | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
display | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
float | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
left | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
opacity | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
outline CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
overflow | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
position | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
resize CSS3 | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
right | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
top | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
visibility | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
z-index | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Lists | Live Hotmail |
Yahoo! |
Outlook 2007/10 |
Apple |
Google Gmail |
Lotus Notes 8.5 |
AOL 10 |
list-style-image | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
list-style-position | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
list-style-type | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
Tables | Live Hotmail |
Yahoo! |
Outlook 2007/10 |
Apple |
Google Gmail |
Lotus Notes 8.5 |
AOL 10 |
border-collapse | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
border-spacing | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
caption-side | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
empty-cells | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
table-layout | ![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
* Guide d'orientation, pourrait subir des changements