Блог

Главная - Вопросы по программированию - Какие атрибуты html/css безопасны для почты?

Какие атрибуты html/css безопасны для почты?

#php #smtp #phpmailer

Вопрос:

Недавно я разрабатывал информационный бюллетень для своего клиента. Однако я, похоже, не могу найти хорошую информацию о том, какие css и html безопасны для использования в основных почтовых клиентах.

Я подумал, что, может быть, здесь есть люди, у которых есть знания, и мы сможем создать какой-то список вещей, которые работают в основных почтовых клиентах.

Это список популярных почтовых клиентов, которые я позаимствовал у campaign monitor. (Если я что-то забыл, пожалуйста, скажи мне)

 Microsoft Outlook
Apple Mail
Hotmail
Yahoo! Mail
Gmail

Вопрос в том, какие теги, атрибуты, особые особенности присутствуют в этих основных браузерах и как их можно легко избежать.

Спасибо за помощь,

Ответ №1:

В Campaign Monitor представлен подробный и исчерпывающий список поддержки CSS в обычных почтовых клиентах.

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

Ответ №2:

Вы можете найти полный список поддерживаемых и не поддерживаемых функций CSS для всех основных почтовых клиентов в проекте Email Standard

Действительно полезная начальная загрузка для разработки HTML-писем, в которой есть множество устранителей несоответствий, — это HTML-электронная почта, заполненная шрифтом

И как общее правило — всегда используйте таблицы и все HTML-теги старой школы ( align , center valign , color и т.д.). Немного почитайте по теме.

Ответ №3:

Комментарии:

1. Первый сейчас сильно устарел 😉 campaignmonitor.com/css

Ответ №4:

Вот электронная css-шпаргалка. http://intenseminimalism.com/2010/email-css-cheatsheet/

Ответ №5:

PDF, предоставляющий формат таблицы для поддержки CSS в различных почтовых клиентах: Предоставляет информацию для веб-клиентов, настольных клиентов на разных ОС и мобильных почтовых клиентов.

Поддержка CSS различными почтовыми клиентами

https://i3.campaignmonitor.com/assets/files/css/campaign-monitor-guide-to-css-in-email-may-2014.pdf?ver=5320amp;_ga=1.228308635.745708791.1442556968

Ответ №6:

Gmail уже поддерживает style тег в заголовке

Вы можете использовать подмножество селекторов CSS для применения стилей. Gmail поддерживает селекторы классов, элементов и идентификаторов.

 <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>

И медиа-запросы:

Вы можете использовать стандартные медиа-запросы CSS для настройки стиля электронной почты в соответствии с текущим устройством пользователя. Gmail поддерживает запросы по ширине экрана, ориентации и разрешению.

 <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>
Метки: