Question

我开发了一个可在Windows和iPad上运行的工作流应用程序。

现在，我想向我的用户发送电子邮件，这将允许他们从他们的电子邮件客户端打开应用程序（如果他们从他们的Windows笔记本电脑运行它，则可以使用Outlook;如果他们在路上，则会发送iPad电子邮件）。

对于Windows，我能做到这一点的唯一方法是附加一个我的应用程序注册的文件打开（包括我想传递给应用程序的信息）。

对于iPad，我将使用我的应用专门为其注册的自定义网址方案添加超链接。

可以从这两个设备中的任何一个打开相同的电子邮件：有没有办法在从iPad查看时隐藏附件，以及从Outlook查看时的超链接？

我知道我也可以注册iPad应用程序来打开相同类型的文件，但我更喜欢超链接选项。

Answer 1

使用CSS @media查询，您可以（并且应该）策略性地隐藏元素以优化手机显示和桌面电子邮件客户端显示

A refrence guide to what & what not to use in emails for all email clients css属性

并用它来检查它是ipad还是个人电脑

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
/* Styles */
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

使用 display：none / block根据您的要求显示隐藏

Answer 2

以下似乎有效：

<style>
    .outlook {display:block}
    .iPad {display:none}

    @media screen and (-webkit-min-device-pixel-ratio:0) {
      .outlook {display:none}
      .iPad {display:block}
    }
</style>

相同的HTML电子邮件应该在Outlook和iPad电子邮件中看起来不同

2 个答案: