如何防止 iOS 13 暗模式破坏电子邮件

How to prevent iOS 13 Dark Mode from breaking emails(如何防止 iOS 13 暗模式破坏电子邮件)

问题描述

我们有一个电子商务应用程序，可以在购买时发送订单详细信息，我们刚刚重新设计了该电子邮件模板.在过去的几天里，我们收到了一些客户的报告，称某些客户的电子邮件中有一半的文字丢失.

We have an e-commerce app that sends out order details when a purchase is made, and we just redesigned that email template. We've received reports over the past few days of some customers having half the text in the email missing.

在最终获得屏幕截图后，我们了解到问题出现在使用深色模式的 iPhone 上.到目前为止，他们都是将 gmail 与 Mail 应用程序或 Safari 一起使用的客户(两者都有相同的问题).我不确定 gmail 因素是否相关或巧合.

After finally getting a screenshot, we've learned that the issue is happening on iPhones using dark mode. So far they've all been customers using gmail with either the Mail app or with Safari (both have the same problem). I'm not sure if the gmail factor is relevant or a coincidence.

我们的电子邮件很简单——它有白色背景、灰色标题和黑色正文.深色模式保持白色背景和灰色标题不变，但正文正在从黑色更改为白色.在白色背景上，白色文字显然是不可见的，电子邮件看起来像是缺少大量内容.

Our email is simple -- it has a white background, gray headings, and black body text. Dark mode is leaving the white background and gray headings untouched, but the body text is being changed from black to white. On the white background, the white text is obviously invisible, and the email looks like it's missing large amounts of content.

有什么办法可以防止暗模式将我们的文本从黑色变为白色?

Is there anything that can be done to prevent dark mode from changing our text from black to white?

我应该注意到，我们还在电子邮件中嵌入了一个 QR 码，所以我担心允许暗模式继续为我们的完整电子邮件重新着色的解决方案，因为我认为这会使 QR 码更难被认可.

I should note that we also have a QR code embedded in the email, so I'm concerned about solutions that would allow dark mode to proceed in recoloring our full email, as I believe it would make it harder for the QR code to be recognized.

这与任何应用程序代码无关，因此不适用为暗模式开发 iOS 的指南.这只是 iOS 13 上的 Apple 邮件应用在深色模式下如何显示 HTML 电子邮件的问题.

this is not related to any app code, so guidelines on developing iOS for dark mode don't apply. This is simply an issue of how Apple's Mail app on iOS 13 in dark mode is displaying an HTML email.

推荐答案

感谢@FrankSchlegel提供的链接

Thanks to the link provided by @FrankSchlegel

https://webkit.org/blog/8840/dark-mode-support-in-webkit/

在所有元素的 css 中使用 color-scheme:light only 就是答案.谢谢！

using color-scheme: light only in the css on all elements was the answer. Thank you!

这篇关于如何防止 iOS 13 暗模式破坏电子邮件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！