提问人:muhammad waseem 提问时间:10/20/2023 更新时间:10/20/2023 访问量:35
如何在电子邮件模板中以深色模式在GMAIL上显示特定图像(使用显示)
how to show a particular image (using display) in dark mode on GMAIL in email templates
问:
我有以下代码片段,其中包含两个图像,一个用于浅色模式,另一个用于深色模式。媒体查询不适用于 iOS Gmail 应用程序。 在 iOS Gmail 应用程序中应用深色模式时,如何显示 .img-dark?
@media (prefers-color-scheme: dark) {
.img-dark {
display: inline-block !important;
}
.img-light {
display: none !important;
}
}
<img
class="header-logo img-light"
src="https://viwell.com/wp-content/uploads/2023/10/viwell-logo.png"
alt="Viwell Logo"
style="width: 284px; height: 64px"
width="284"
height="64" /><img
class="header-logo img-dark"
src="https://viwell.com/wp-content/uploads/2023/10/viwell-logo-dark.png"
alt="Viwell Logo"
style="
width: 284px;
height: 64px;
display: none;
"
width="284"
height="64"
/>
答:
0赞
Kostya
10/20/2023
#1
iOS 版 Gmail 应用不支持媒体查询。要在 Gmail iOS 应用中显示 .img-dark 图片,您需要使用其他方法。
一种方法是使用 data-src 属性来存储暗模式下的图像路径。然后,您可以使用 JavaScript 检查当前的查看模式并显示相应的图像。
data-src="https://viwell.com/wp-content/uploads/2023/10/viwell-logo-dark.png"
评论
0赞
muhammad waseem
10/20/2023
在电子邮件模板中,任何电子邮件客户端都不允许使用 JavaScript
评论