HTML电子邮件在客户端折叠时打开

时间:2016-05-02 23:23:50

标签: html html-email

我正在编写一封HTML电子邮件,我注意到在Gmail桌面和移动应用中打开整个邮件时,打开它已折叠,我必须按3点才能展开。

有没有办法(我收到的大多数其他HTML电子邮件已展开展开)将我的邮件展开?

我使用的是Swift邮件程序(PHP),我的电子邮件样式如下。

<style type="text/css">
div, p, a, li, td {
    -webkit-text-size-adjust: none;
}
.ReadMsgBody {
    width: 100%;
    background-color: #d1d1d1;
}
.ExternalClass {
    width: 100%;
    background-color: #d1d1d1;
    line-height: 100%;
}
body {
    width: 100%;
    height: 100%;
    background-color: #d1d1d1;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    color: #333333;
}
html {
    width: 100%;
}
img {
    -ms-interpolation-mode: bicubic;
}
div[style*="margin: 16px 0"] {
    margin: 0 !important;
}
.wrapper {
    width: 100%;
    table-layout: fixed;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}
.webkit {
    max-width: 600px;
    margin: 0 auto;
}
table[class=full] {
    padding: 0 !important;
    border: none !important;
}
table td img[class=imgresponsive] {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}

@media only screen and (max-width: 800px) {
body {
    width: auto!important;
}
table[class=full] {
    width: 100%!important;
}
table[class=devicewidth] {
    width: 100% !important;
    padding-left: 20px !important;
    padding-right: 20px!important;
}
table td img.responsiveimg {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}
}

@media only screen and (max-width: 640px) {
table[class=devicewidth] {
    width: 100% !important;
}
table[class=inner] {
    width: 100%!important;
    text-align: center!important;
    clear: both;
}
table td a[class=top-button] {
    width: 160px !important;
    font-size: 14px !important;
    line-height: 37px !important;
}
table td[class=readmore-button] {
    text-align: center !important;
}
table td[class=readmore-button] a {
    float: none !important;
    display: inline-block !important;
}
.hide {
    display: none !important;
}
table td[class=smallfont] {
    border: none !important;
    font-size: 26px !important;
}
table td[class=sidespace] {
    width: 10px !important;
}
}

@media only screen and (max-width: 520px) {
}

@media only screen and (max-width: 480px) {
table {
    border-collapse: collapse;
}
table td[class=template-img] img {
    width: 100% !important;
    display: block !important;
}
}

@media only screen and (max-width: 320px) {
}
</style>

我的头像:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--<![endif]-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--[if (gte mso 9)|(IE)]>
<style type="text/css">
    table {border-collapse: collapse;}
</style>
<![endif]-->
<link href='http://fonts.googleapis.com/css?family=Raleway:400,300,700,600' rel='stylesheet' type='text/css'>
<head>
<!--[if gte mso 12]>
<style type="text/css">
    [a.btn {
    padding:15px 22px !important;
    display:inline-block !important;
}]
</style>
<![endif]-->

0 个答案:

没有答案