gpt4 book ai didi

email - 如何使响应电子邮件与yahoo移动应用一起工作?

转载 作者:行者123 更新时间:2023-11-27 23:44:02 25 4
gpt4 key购买 nike

我创建了一个电子邮件模板,该模板经过测试可在桌面客户端(如gmail / yahoo / outlook)上正常运行,并且还测试了移动gmail应用程序上的正确响应行为。我正在使用Android / Galaxy S4。

响应样式在yahoo移动应用程序上无效。实际上,它不是从“样式”中读取CSS规则。但是,将桌面chrome设置为移动视图(使用Inspect->切换设备工具栏),然后登录yahoo邮件将显示电子邮件,其中显示了响应式样式。

问题:雅虎移动应用程序不支持响应能力吗?还是特别需要其他技巧?



更新:
我尝试将CS​​S样式从头部移到身体。然后读取样式。但是,将样式保留在体内可能不是一个好主意,gmail移动应用程序现在将其忽略。



这是我正在使用的电子邮件代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Sample Page</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="x-apple-disable-message-reformatting">
<style>
body {
mso-line-height-rule:exactly;
-ms-text-size-adjust:100%;
-webkit-text-size-adjust:100%}
table, td {
mso-table-lspace: 0pt;
mso-table-rspace: 0pt}
table {
border-collapse: collapse;
border-spacing: 0;margin: 0 auto}
img, a img {
border:0 none;
height: auto;
line-height: 100%;
outline: none;
-ms-interpolation-mode: bicubic}
a[x-apple-data-detectors] {
color: inherit !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important}
.x-gmail-data-detectors, .x-gmail-data-detectors *, .aBn {
border-bottom: 0 !important;
cursor: default !important}
.a6S {
display:none !important;
opacity:0.01 !important}
img.g-img + div {
display:none !important}
.button-link {
text-decoration: none !important}
@media only screen and (min-device-width: 375px) and (max-device-width: 413px) {
.ios-gm-fix {
min-width: 375px !important;}
}
</style>
<style>
#email-container {
border:1px solid #CCC;
border-radius:3px;
border-collapse:separate}
.desktop-view {color:blue}
.mobile-view {color:#444}
@media only screen and (max-width: 480px) {
#email-container-wrap {
width:100% !important;
padding:0 !important}
#email-container {
border:none;border-radius:0}
.desktop-view {color:#444}
.mobile-view {color:blue}
#email-contents {
padding:15px 22px !important;
font-size:16px!important}
}
</style>
</head>
<body width="100%" bgcolor="#FFFFFF" style="margin:0 auto;padding:0;height:100%">
<center style="width=100%;background=#ffffff">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="#F0F0F0" class="ios-gm-fix" style="margin:0;width:100%;line-height:100%"><tbody>
<tr>
<td align="center" valign="top" width="100%" style="padding:0;margin:0;height:100%;width:100%">
<div id="email-container-wrap" style="width:600px;max-width:600px;padding:25px 0;margin:0 auto">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%" bgcolor="#ffffff" id="email-container" style="background-color:#ffffff"><tbody>
<tr>
<td align="center" valign="top" width="100%" id="email-contents" style="font-family:arial,helvetica,sans-serif;font-size:13px;line-height:18px;color:#333333;padding:20px 35px">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%"><tbody>
<tr>
<td align="center" valign="top" width="100%" id="email-header">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%"><tbody>
<tr>
<td align="left" valign="top" width="100%"></td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
<td align="center" valign="top" width="100%" id="email-body">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr>
<td align="left" valign="top" width="100%">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%"><tbody>
<tr>
<td align="left" valign="top" width="100%" class="desktop-view" style="padding:3px 0 16px">
<span>On Desktop, there will be a border and gray background on all sides.</span>
</td>
</tr>
<tr>
<td align="left" valign="top" width="100%" class="mobile-view" style="padding:3px 0 16px">
<span>On Mobile, the border and background will not exist.</span>
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td align="center" valign="top" width="100%" id="email-footer">
<table role="presentation" border="0" cellspacing="0" cellpadding="0" width="100%"><tbody>
<tr>
<td align="left" valign="top" width="100%">
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
</div>
</td>
</tr>
</tbody></table>
</center>
</body>
</html>

最佳答案

在Android上,Yahoo在<style>中仅支持<body>标记,而在<head>中不支持。但是Gmail仅在<style>中支持<head>标记,而不在<body>中支持。这就是生活!

由于我们仅处理约20行代码(假设示例中为第二个<style>标记),因此您可以尝试复制此<style>标记,使其同时出现在<head><body>中。我不确定这是否行得通,但是值得测试。

关于email - 如何使响应电子邮件与yahoo移动应用一起工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56890266/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com