Question

我在php中开发了一个约会网站，它也有移动版本。我设计了一个html电子邮件模板并将其存储在一个包含php变量的文件夹中，我将在发送电子邮件时将其替换。我想在这里做的是，当我的网站发送的任何电子邮件在移动设备上打开时，它不应该有缩放电子邮件的选项。在我的电子邮件模板中，我会在代码下面。

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0,target-densitydpi=device-dpi, user-scalable=no" />

如果我在移动浏览器中查看电子邮件模板，它没有缩放选项，但如果我在gmail应用中查看电子邮件，我可以缩放电子邮件。

请告诉我如何停止Gmail中的缩放功能。提前谢谢。

<html>
        <head>
            <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0,target-densitydpi=device-dpi, user-scalable=no" />
        </head>
        <body style="-webkit-text-size-adjust:none;">
            <table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#000000; height:52px;">
                <tr>
                    <td align="center">
                        <center>
                            <table border="0" cellpadding="0" cellspacing="0" width="600px" style="height:100%;">
                                <tr><td align="left" valign="middle" style="padding-left:20px;"><a href="SITENAME"><img src="SITENAME/images/logo.png" /></a></td></tr>
                            </table>
                        </center>
                    </td>
                </tr>
            </table>
            <table width="100%" cellspacing="0" cellpadding="0" border="0">
                <tbody>
                    <tr>
                        <td>
                            <center>
                                <table style="height:100%;" width="600px" cellspacing="0" cellpadding="0" border="0">
                                    <tbody>
                                        <tr>
                                            <td style="padding-left:20px; padding-bottom:20px" valign="bottom" align="left">
                                                    <div style="color: #444444; font-family: Open Sans; font-size: 15px; line-height: 150%;text-align: left;">
                                                    {{EMAILCONTENT}}    
                                                    </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </center>
                        </td>
                    </tr>
                </tbody>
            </table>
        </body>
    </html>

Answer 1

使用emailcontent将此代码放在您的DIV上，您可以在其中声明font-family，font-size等。

.no-zoom {
  touch-action: manipulation;
}

如何在html电子邮件模板中覆盖gmail视口？

1 个答案: