Форматирование абзацев для HTML-писем - PullRequest
Новая
       8

Форматирование абзацев для HTML-писем

0 голосов
/ 21 мая 2011

У меня есть 2 последовательных абзаца в HTML-письме.Мне нужно, чтобы между двумя абзацами не было пробела, но мне нужно 30 пикселей в верхней части первого абзаца и в нижней части второго абзаца.

Я могу удалить пробелы между двумя абзацами, используя:

p{
   padding:0;
   margin:0;
 }

Для места в верхней и нижней части параграфа я могу использовать 

 p{
       margin-top: 30px;
       margin-bottom: 30px;
    }

Все это прекрасно работает для Outlook и браузеров.Но когда я использую его для окружения (MAC-адрес электронной почты) / gmail, пробел между абзацами все равно сохраняется.

Как мне избавиться от пробела?

Ответы [ 4 ]

2 голосов
/ 21 мая 2011

Большинство веб-клиентов электронной почты (hotmal, gmail) НЕ будут соблюдать стили, определенные внутри тега <style>, просто потому, что они просто отбрасывают (почти) все, что определено внутри раздела head.Вы должны сделать ваши стили встроенными.

0 голосов
/ 21 мая 2011

Вы можете упаковать свои параметры: 

<div>
  <p>top paragraph</p>
  <p>bottom paragraph</p>
</div>

и добавить в свой CSS: 

div
{
   padding: 30px 0;
}
0 голосов
/ 21 мая 2011

попробуйте следующим образом: 

<style type="text/css">
p{background-color:green;}
div+p { margin-top:30px; }
p+p{ margin-bottom :30px; }
</style>

<div align="center"></div>
<p> first paragraph </p>
<p>Second Paragraph </p>

Рабочий DEMO

Ссылка:

селектор соседнего брата

0 голосов
/ 21 мая 2011

Это те редкие случаи, когда использование встроенного CSS имеет смысл

это должно быть в вашем CSS 

p{
   padding:0;
   margin:0;
 }

и в вашей строке 

style='margin-top: 30px;'

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

пример: 

div:firstchild  p {
  ... rules..
}

выберет первого ребенка

...