Фон HTML электронной почты Gmail

Я работаю над электронным письмом HTML. Проблема, которую я получаю, заключается в том, что GMAIL не использует "фоновое положение", которое я ему даю. У меня есть таблица со 100% шириной, которая имеет фон, который должен быть центрирован. Большинство клиентов делают это отлично, но Gmail этого не делает. Есть ли обходной путь для этого?

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

<table style="background-repeat: no-repeat; background-position: center top;" border="0" width="100%" align="center" bgcolor="#1E1411" background="assets/mainback2.jpg">

Ответ 1

Возможно, вам просто нужно поместить весь стиль фона в одну строку, например:

background:#1E1411 url(assets/mainback2.jpg) no-repeat center top;

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

background:url(assets/mainback2.jpg) no-repeat center top;
background-color:#1E1411;

Ответ 2

Вы ответили на свой вопрос.

GMAIL не использует "background-position

статья

Ответ 3

Возможно, вам нужно определить свой фон в кавычках STYLE отдельно. напишите вот так:

<table style="background-repeat: no-repeat; background-position: center top; background-image:url(assets/mainback2.jpg)" border="0" width="100%" align="center" bgcolor="#1E1411">

Ответ 4

От: http://css-tricks.com/using-css-in-html-emails-the-real-story/

ЧТО ВЫ НЕ МОЖЕТЕ:

Включить раздел со стилями. Apple Mail.app поддерживает его, но Gmail и Hotmail этого не делают, поэтому нет-нет. Hotmail будет поддерживать раздел стиля в теле, но Gmail до сих пор этого не делает.

Ссылка на внешнюю таблицу стилей. Немногие клиенты электронной почты поддерживают это, лучше всего просто забыть об этом.

Фоновое изображение/Фоновая позиция. Gmail также является виновником этого. Очистите ваши поплавки. Gmail снова.

Margin. Да, серьезно, Hotmail игнорирует поля. В принципе, любое позиционирование CSS вообще не работает.

Font-нибудь. Скорее всего, Eudora проигнорирует все, что вы пытаетесь объявить шрифтами. Есть еще немало вещей, о которых вы должны знать. Для получения полного полного списка того, что онлайн-службы электронной почты поддерживают, ознакомьтесь с этой статьей на Xavier Frenette.

Итак, никто не может делать приятель.

Ответ 5

Поместите фоновое изображение на td как,

<td background="http://someimageurl" style="background-repeat:no-repeat">

а затем расположите table по центру на align="center". Дайте таблицу same width в качестве фона, чтобы получить центрированный эффект. Решение центрирования этого не применимо ко всем случаям.

Ответ 6

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

http://www.campaignmonitor.com/blog/post/3170/adding-background-images-to-your-email-in-two-simple-steps/

Ответ 7

Попробуйте проверить это http://zurb.com/, его HTML-письма, которые работают на любом устройстве и клиенте.