встроенное использование font-weight изменение шрифта без засечек на serif в некоторых Outlook для Windows

#html-email

Вопрос:

Новичок, использующий div и встроенное значение шрифта вокруг текста в HTML-письме, чтобы более точно соответствовать легкому веб-шрифту без засечек. Он отлично отображает электронную почту с помощью инструмента Acid. Кодируйте следующим образом:

\div style=»выравнивание текста: по левому краю; семейство шрифтов: Helvetica Neue, Helvetica, Arial, Verdana, без засечек; размер шрифта: 18 пикселей; вес шрифта: 300; цвет: #333333; высота строки: 28 пикселей;»\

Один из VIP-пользователей ПК / Outlook видит Arial в шрифте Times New Roman с засечками. Я не вижу, как.

Как я могу преодолеть это — без слишком большого количества CSS? (Я новичок в CSS.) Спасибо.

Ответ №1:

Используйте условные теги для Outllook, чтобы принудительно использовать семейство шрифтов (только родные) и высоту строки

 <!--[if (gte mso 9)|(IE)]>
<style type="text/css">
    td,
    td p,
    td a {            
        font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif !important;                 
    }

    td p,
    td a {
        mso-line-height-rule: exactly !important;
    }
</style>

1. Также для справки, Microsoft / Outlook объявили, что это будет удалено в будущих версиях Outlook. Но поскольку это электронное письмо все равно должно содержать исправление, указанное выше для более старых версий/

Ответ №2:

Outlook не поддерживает Helvetica Neue. Когда вы добавляете специальный веб-шрифт в семейство шрифтов, он возвращается к Times New Roman.

Подробнее о шрифтах для электронной почты смотрите здесь: https://www.emailonacid.com/blog/article/email-development/best-font-for-email-everything-you-need-to-know-about-email-safe-fonts/

1. Спасибо. Искренне ценю ваше терпение.

2. Пожалуйста, включите важные элементы со страницы, чтобы они были в Stack Overflow на случай, если страница потеряна или не работает.

3. Как обычно, Outlook 2007/10/13 не играет в мяч и не поддерживает font-face или <link> . Кроме того, при включении специального веб-шрифта в семейство шрифтов он вернется к Times New Roman, независимо от того, указали вы запасной вариант или нет. При использовании метода импорта шрифтов font-face убедитесь, что вы перенесли его в media{}: <style> media { font-face { семейство шрифтов: ‘Timmana’; стиль шрифта: обычный; вес шрифта: 400; src: local (‘Timmana’), url ( fonts.gstatic.com/s/timmana/v3 /… ) формат (‘woff2’); } } </style>