Вертска письма

Помощник в верстке email-писем (Letter Layout, HTML-код)

Основные положения:
Для верстки писем используется табличная верстка. Используем только Inline-стили, то есть применять непосредственно к тегам. Писать CSS в тегах head и body запрещено, так как некоторые клиенты будут удалять все, что находится в этих тегах.

Если вы верстаете для всех устройств, включая мобильные телефоны и планшеты, то ширина письма не должна превышать 600px. Если использовать ширину больше этого значения, то письмо по ширине не поместится в почтовый клиент.

Порядок CSS
font-family
font-size
font-weight
line-height
display
width
max-width
height
margin
margin-right
margin-left
padding
padding-top
padding-right
padding-bottom
padding-left
table-layout
border-spacing
border-collapse
text-align
text-decoration
color
border
border-width
border-style
border-color
border-radius
background
background-color

Шрифты

font-family: Arial, Helvetica, sans-serif;
font-family: 'Arial Black', Gadget, sans-serif;
font-family: Georgia, serif;
font-family: 'MS Sans Serif', Geneva, sans-serif;
font-family: 'MS Serif', 'New York', sans-serif;
font-family: Tahoma, Geneva, sans-serif;
font-family: 'Times New Roman', Times, serif;
font-family: 'Trebuchet MS', Helvetica, sans-serif;
font-family: Verdana, Geneva, sans-serif;

Для таблицы (table):

border="0" – задаем толщину рамки в пикселях;
cellpadding="0" – задаем отступ от рамки до содержимого ячейки;
cellspacing=«0» – задаем расстояние между ячейками;
width="100%" – задаем ширину таблицы;
style="margin:0; padding:0" – обнуляем внутренние и внешние отступы, которые добавляет некоторые почтовые клиенты: