为什么Gmail不适用HTML-ized Dataframe Styler?

时间:2018-05-10 03:33:56

标签: python html pandas

我遇到了一个非常具有挑战性的问题。我试图编写一个Python脚本来将样式化的Dataframe发送到Gmails。我需要在电子邮件正文中显示如下所示,我在HTML文件中成功。

enter image description here

然而,我在电子邮件中收到的内容是这样的:

enter image description here

似乎Gmail并未将CSS样式应用于字体颜色。

我的代码如下:

# Load sample data
import pandas as pd
df = pd.read_csv('test.csv');df
# Fill missing values
df.fillna('-',inplace = True);df
# Add 2 level column name
columns=[
    ('Overview', 'Date'),
    ('Overview', 'City'),

    ('Group A','col_a'),
    ('Group A','col_b'),

    ('Group B','col_a'),
    ('Group B','col_b'),
    ('Group B','col_c'),
];

df.columns=pd.MultiIndex.from_tuples(columns);df

# Define function for font color
def color_highlight(val):
    try:
        pct = float(val.split('(',1)[1].split('%',1)[0])
        if pct<-1:
            color = 'red'
        elif pct>1:
            color = 'green'
        else: color='black'
        return 'color: %s' % color
    except IndexError:
        return 'color: black'

# Use Pandas styler to apply UDF and export HTML string
s2 = df.style.applymap(color_highlight,
                      subset=pd.IndexSlice[:
                                           ,[    ('Group A','col_a'),
                                                ('Group A','col_b'),

                                                ('Group B','col_a'),
                                                ('Group B','col_b'),
                                                ('Group B','col_c')
                                            ]]) \
    .set_table_attributes('border="1" class="dataframe" style="border-collapse: collapse;"') \
    .render().split('\n')
s2 = ''.join(s2)
s2
html = s2

# Send email
import smtplib
import time
from email.mime.multipart import MIMEMultipart
from email.mime.text import MIMEText
from email.mime.base import MIMEBase
from email.mime.application import MIMEApplication

sender = 'alichenxiang@gmail.com'
recipients = ['myboss@gmail.com','myteam@gmail.com']

msg = MIMEMultipart('alternative')
msg['Subject'] = 'REMINDER: Data alert'
msg['From'] = sender
msg['To'] = ", ".join(recipients)

#put the html into the email body
html = MIMEText(html, 'html')
msg.attach(html)

server = smtplib.SMTP('smtp.gmail.com:587')
server.connect('smtp.gmail.com',587)

server.ehlo()
server.starttls()
server.ehlo()

username = 'alichenxiang@gmail.com'
password = 'mypassword'
server.login(username,password)

#server.sendmail(sender, tolist, msg.as_string())
server.sendmail(sender, recipients, msg.as_string())
server.quit()
print("Success")

以下是生成的HTML:

<style  type="text/css" >    #T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col2 {            color:  black;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col3 {            color:  green;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col4 {            color:  black;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col5 {            color:  red;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col6 {            color:  green;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col2 {            color:  black;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col3 {            color:  red;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col4 {            color:  black;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col5 {            color:  red;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col6 {            color:  black;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col2 {            color:  black;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col3 {            color:  red;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col4 {            color:  black;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col5 {            color:  green;        }    #T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col6 {            color:  black;        }</style>  <table id="T_dcf16f78_5384_11e8_972a_8c859034ed75" border="1" class="dataframe" style="border-collapse: collapse;"> <thead>    <tr>         <th class="blank level0" ></th>         <th class="col_heading level0 col0" colspan=2>Overview</th>         <th class="col_heading level0 col2" colspan=2>Group A</th>         <th class="col_heading level0 col4" colspan=3>Group B</th>     </tr>    <tr>         <th class="blank level1" ></th>         <th class="col_heading level1 col0" >Date</th>         <th class="col_heading level1 col1" >City</th>         <th class="col_heading level1 col2" >col_a</th>         <th class="col_heading level1 col3" >col_b</th>         <th class="col_heading level1 col4" >col_a</th>         <th class="col_heading level1 col5" >col_b</th>         <th class="col_heading level1 col6" >col_c</th>     </tr></thead> <tbody>    <tr>         <th id="T_dcf16f78_5384_11e8_972a_8c859034ed75level0_row0" class="row_heading level0 row0" >0</th>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col0" class="data row0 col0" >20180507</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col1" class="data row0 col1" >Madrid</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col2" class="data row0 col2" >1,657(0.3%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col3" class="data row0 col3" >839(1.2%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col4" class="data row0 col4" >75,746(0.2%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col5" class="data row0 col5" >4,168(-8.1%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row0_col6" class="data row0 col6" >3,486(2.1%)</td>     </tr>    <tr>         <th id="T_dcf16f78_5384_11e8_972a_8c859034ed75level0_row1" class="row_heading level0 row1" >1</th>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col0" class="data row1 col0" >20180507</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col1" class="data row1 col1" >Tokyo</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col2" class="data row1 col2" >33(0.0%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col3" class="data row1 col3" >18(-5.3%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col4" class="data row1 col4" >13,344(0.1%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col5" class="data row1 col5" >981(-2.3%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row1_col6" class="data row1 col6" >1,416(0.1%)</td>     </tr>    <tr>         <th id="T_dcf16f78_5384_11e8_972a_8c859034ed75level0_row2" class="row_heading level0 row2" >2</th>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col0" class="data row2 col0" >20180507</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col1" class="data row2 col1" >London</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col2" class="data row2 col2" >-</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col3" class="data row2 col3" >37(-2.6%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col4" class="data row2 col4" >10,434(0.0%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col5" class="data row2 col5" >53(1.9%)</td>         <td id="T_dcf16f78_5384_11e8_972a_8c859034ed75row2_col6" class="data row2 col6" >1(0.0%)</td>     </tr></tbody> </table>

2 个答案:

答案 0 :(得分:1)

在html电子邮件模板中使用内联CSS,因为电子邮件模板无法捕获css。

答案 1 :(得分:0)

由于Gmail的头部不支持CSS样式,因此需要对其进行处理并将样式作为内联样式附加到各个元素上。

在附加到邮件之前,您可以拥有自己的功能来处理html,也可以使用python premailer 软件包进行处理。

    from premailer import transform


    post_transform_html = transform(html, pretty_print=True)
    msg.attach(post_transform_html)

它将按预期工作。

谢谢