如何避免电子邮件客户端中的剪辑答案

【问题标题】：How to avoid clipping in email clients如何避免电子邮件客户端中的剪辑
【发布时间】：2019-07-23 09:32:33
【问题描述】：

我正在设计发票电子邮件。整个电子邮件客户端渲染让我抓狂。

是否可以像在 iOS 中一样在 Gmail 应用电子邮件客户端上显示整个内容（缩小）？

现在，Gmail 应用电子邮件正在削减我一半的电子邮件。

iOS 显示的内容类似于桌面版

更新：添加源代码（仅部分）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<title>Web Bestellung</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="x-apple-disable-message-reformatting" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style type="text/css">
    body, .maintable { height:100% !important; width:100% !important; margin:0; padding:0;}
    img, a img { border:0; outline:none; text-decoration:none;}
    p {margin-top:0; margin-right:0; margin-left:0; padding:0;}
    .ReadMsgBody {width:100%;}
    .ExternalClass {width:100%;}
    .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height:100%;}
    img {-ms-interpolation-mode: bicubic;}
    body, table, td, p, a, li, blockquote {-ms-text-size-adjust:100%; -webkit-text-size-adjust:100%;}
</style>
<!-- <style type="text/css">
@media only screen and (max-width: 480px) {
 .rtable {width: 100% !important;}
 .rtable tr {height:auto !important; display: block;}
 .contenttd {max-width: 100% !important; display: block; width: auto !important;}
 .contenttd:after {content: ""; display: table; clear: both;}
 .hiddentds {display: none;}
 .imgtable, .imgtable table {max-width: 100% !important; height: auto; float: none; margin: 0 auto;}
 .imgtable.btnset td {display: inline-block;}
 .imgtable img {width: 100%; height: auto !important;display: block;}
 table {float: none;}
 .mobileHide {display: none !important;}
}
</style> -->
<!--[if gte mso 9]>
<xml>
  <o:OfficeDocumentSettings>
    <o:AllowPNG/>
    <o:PixelsPerInch>96</o:PixelsPerInch>
  </o:OfficeDocumentSettings>
</xml>
<![endif]-->
</head>

https://jsfiddle.net/5qpdk63h/

【问题讨论】：

您好 Greg，这很可能是由于您用于发送这些的系统提供的臃肿代码。您是否有权修改代码？如果是这样，你可以发帖吗？没有看到任何代码，任何电子邮件客户端都不容易修复，所以如果你能提供代码，我们可以帮助调试
嗨，我在我的问题中添加了源代码 + jsfiddle 链接。这是我之前用MailStyler2做的代码，然后对源代码做了一些改动。
你无法避免 gmail 剪辑，你必须减少你的电子邮件代码长度。例如，请参阅emailmonks.com/blog/email-design/avoid-gmail-clipping 以获得一些建议。
嗨 Veve，我的电子邮件的准确大小是 52kB。所以这不是问题。桌面上的 Gmail 电子邮件也可以毫无问题地呈现模板。真的找不到有用的网站来显示如何为 gmail 应用程序电子邮件客户端设置 html 模板样式的规则。
This may be helpful给你

标签： html css email html-email

【解决方案1】：

您的完整 html 文件是否超过 102KB？您可能需要精简代码。

GMAIL 的文件大小限制为 102KB。在 102KB 之后，它将剪辑电子邮件以显示该数量的内容，其余部分将用“单击此处查看完整电子邮件”消息进行剪辑。

超过这个重量限制也会弄乱你的布局，因为 GMail 会在 102K 标记所在的地方切开，无论它是否包括关闭表格和其他东西。

【讨论】：

嗨，我的文件有 52KB 大。