2013-11-15 1 views
0

Я не могу видеть стили CSS, когда по электронной почте отправляется следующая страница html (Yahoo/Gmail) с использованием mutt.I просто вижу простой стол. Но я получаю желаемый стиль при просмотре его в браузере. Почему это так ? Я что-то упускаю ?Нет стилей CSS в электронной почте

mutt -e "set content_type=text/html" [email protected] -s "Test" < Test.html 

test.html

<!DOCTYPE html> 
<html> 
<head> 
<style> 
rd{ color: red; } 
gn{ color: green; } 
body { background-color:#E0E0E0; font-family: helvetica;font-size: 15px;} 
</style> 
</head> 
<body> 
<table border="1" align ="left"> 
<tr><th>No.</th><th>Item</th></tr> 
<tr><td>1</td><td><gn>abc</gn></td></tr> 
<tr><td>2</td><td><rd>ghi</rd></td></tr> 
</table> 
</body> 
</html> 
+4

Что такое 'rd' и' gn'? – Sachin

+2

Попробуйте добавить стиль inline - большинство почтовых клиентов вычеркивают теги стиля. – brouxhaha

+1

У вас есть недопустимый HTML, вам нужно закрыть свой последний '', а' gn' не является тегом HTML. – putvande

ответ

1

HTML-почта очень ограничена до точки, где даже DIV и р теги не всегда действуют, как и ожидалось. Попытка создать свои собственные теги просто просит неприятностей.

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

<tr><td>1</td><td style="font-family: Helvetica, Arial, sans-serif; font-size: 15px; color:#007700;">abc</td></tr> 
<tr><td>2</td><td style="font-family: Helvetica, Arial, sans-serif; font-size: 15px; color:#770000;">ghi</td></tr> 

В дополнении к всегда встраиванию вашего CSS, вы должны использовать 6-значный шестнадцатеричный цвет для максимальной поддержки почтового клиента. Вы также должны повторно объявить стили шрифтов в каждой ячейке таблицы. Излишнее, как это, к сожалению, это то, что нужно в html-email.

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

+0

Хм..Это много избыточного кода для таблицы с несколькими столбцами и строками. Наверное, у меня нет выбора. – Jean

4

Путь включить CSS в HTML электронной почты является использование встроенных стилей.

<!DOCTYPE html> 
    <html> 
    <body style='background-color:#E0E0E0; font-family: helvetica;font-size: 15px;'> 
     <table border="1" align="left" style="color:red;"> 
      <tr><th>No.</th><th>Item</th></tr> 
      <tr><td>1</td><td><gn>abc</gn></td></tr> 
     </table> 
    </body> 
    </html> 

Ref: http://www.htmlgoodies.com/beyond/css/article.php/3679231

+0

@Jean Но вы получаете концепцию, используя встроенные стили. – Leng

 Смежные вопросы

  • Нет связанных вопросов^_^