Целевая почта Windows Live с определенным css

Короче говоря, я делаю электронное письмо в формате HTML (да, я знаю). Я довел его до такой степени, что он отлично выглядит в GMail, Yahoo Mail, Thunderbird и Outlook 2003 (не тестировал 07...). Единственная проблема — это Hotmail (Windows Live Mail). Тот факт, что он вообще не поддерживает фоновые изображения, не беспокоит меня в отношении моего макета... из-за макета мне нужно вместо этого установить ширину таблицы как заданное значение (550 пикселей). процента (80%), иначе мое изображение заголовка будет просто плавать в пространстве и выглядеть некрасиво.

Итак, теперь у меня есть два варианта, как я это вижу: создать правило css для Hotmail, чтобы установить ширину как статическое значение (я не знаю, возможно ли это) или чтобы мой шаблон почтовой программы изменялся на лету на основе независимо от того, принадлежит ли получатель '@hotmail.com'. Я бы предпочел первое, а не второе.

Пояснение: для простоты представьте себе div шириной 550 пикселей и высотой 150 пикселей. У него есть фоновое изображение с повтором-x. Внутри этого div у меня есть img высотой 150 пикселей и шириной 550 пикселей. Если внешний div установлен на 80% области просмотра, он должен расширяться влево и, таким образом, открывать повторяющийся фон. Это то, что ожидается. Поскольку Hotmail не показывает фоновые изображения, это просто пустое пространство.

Дополнительные пояснения: перейдите здесь, чтобы увидеть пример того, что я имею в виду.


css email html-email windows-live
person SnakeWasTheNameTheyGaveMe    schedule 23.06.2011    source источник
comment
CSS в меньшей степени поддерживается в информационных бюллетенях Outlook/Hotmail. Так что лучше использовать ‹img› вместо фонового изображения.   -  person Ahsan Rathod    schedule 23.06.2011
comment
Вы должны проверить это, там есть несколько довольно полезных советов по разработке электронных писем в формате html.   -  person Steve Day    schedule 23.06.2011
comment
Извините, я, возможно, немного ввел вас в заблуждение - у меня есть фоновое изображение, которое обычно повторяет -x, но когда его нет, мое обычное изображение заголовка (которое никогда не является фоновым изображением) выглядит так, как будто оно плавает в пустом пространстве. Я исправлю исходный вопрос, чтобы отразить это.   -  person SnakeWasTheNameTheyGaveMe    schedule 24.06.2011
comment
Это будет выглядеть так же и в Outlook 2007. Вы действительно должны использовать абсолютную ширину и фоновый цвет, который срабатывает, когда фоновое изображение не поддерживается. Это не сработает иначе.   -  person Thomas    schedule 24.06.2011
comment
@Steve Day - глядя на вашу ссылку, в части о предоставлении резервных цветов для фоновых изображений почти точно говорится о моей проблеме. Но мое решение состоит не в том, чтобы предоставить запасной цвет, а в том, чтобы явно установить ширину контейнера. Из-за того, как установлено изображение заголовка, предоставление резервного цвета не дает приятных результатов.   -  person SnakeWasTheNameTheyGaveMe    schedule 24.06.2011

Ответы (3)


arrow_upward
1
arrow_downward

Попробуйте поместить это в каждый тег изображения:

style="display: block"

У вас не может быть другого CSS, так как все должно быть встроенным. Вы также должны использовать таблицы (я знаю, я знаю). Если бы вы могли опубликовать какой-нибудь источник, я мог бы помочь немного дальше.

person Thomas    schedule 23.06.2011
comment
Я надеялся что-то вроде взлома css (взлом звезды или что-то, что использует собственные правила css hotmail для добавления правила поверх уже существующего) - person SnakeWasTheNameTheyGaveMe; 24.06.2011

arrow_upward
0
arrow_downward

В конце концов мне пришлось изменить свою электронную почту прямо перед отправкой на основе пользовательского списка правил (замена регулярных выражений на основе домена).

person SnakeWasTheNameTheyGaveMe    schedule 27.06.2011

arrow_upward
0
arrow_downward

Я знаю, что это старый вопрос, но он может быть полезен людям, которые все еще борются с Интернетом, Windows Outlook и почтой Windows.

Я нашел способ скрыть элементы специально для Windows Outlook и почтового приложения:

<span style="mso-element:field-begin;"></span>
 Content to hide from Outlook 
<span style="mso-element:field-end;"></span>

ссылку на этот замечательный блог.

также вы можете настроить таргетинг на все приложения Outlook (мобильные, веб, настольные) как:

<!--[if mso]> 
    <div> Your content that you want visible </div>            
<![endif]-->

вы также можете инвертировать его с другими условиями и настроить таргетинг на определенные версии, например:

<!--[if !mso]> Everything not mso (outlook or windows mail) <![endif]-->
<!--[if gte mso 16]> All mso versions that are greater than 16 <![endif]-->

подробнее об этом в этом ссылка.

Что касается отображения фоновых изображений в настольных/Windows-версиях Outlook (почтовое приложение и Outlook ms), вы можете использовать VML, и больше об этом вы можете найти здесь.

person Kerim092    schedule 10.06.2021