在表格上设置线性渐变,该渐变将改变outlook的深色方案的颜色



我正在尝试设置一个纯色背景,它将覆盖第一个单元格和第二个单元格的一部分。

不幸的是,在outlook电子邮件客户端的深色方案测试后,它无法使背景颜色变深(就像它可以做的那样),文本不再可见。

我猜outlook会跳过background-image格式,但如果只使用background-color,我将无法达到相同的效果。

问题:是否有一种解决方法可以在黑暗方案中产生同样的效果??

<table role="presentation" bgcolor="#ffffff" style="width: 100%; border-collapse: collapse; border: 0; border-spacing: 0;">
<tr>
<td align="center" style="padding:0; background-image:linear-gradient(#D7DDDA 0%, #D7DDDA 100%); background-size: 100% 70%; background-repeat: no-repeat; height: 442.5px;" width="auto">
<table role="presentation">
<tr>
<td style="padding: 0;" align="center">
<p width="639.4666666666667" style="padding: 26.6pt 0 0 0; width: 479.6pt; font-family: 'FiraGo Light', Georgia, 'Times New Roman', Times, serif; font-style: normal; font-size: 16pt; line-height: 24pt; mso-line-height-rule:exactly; color: #3a3735;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</td>
</tr>
<tr>
<td style="padding: 0;" align="center">
<img src="https://dummyimage.com/600x400/000/fff" alt="Rooms Hotel Kokhta Camping" width="639.4666666666667" style="height: auto; padding: 23.4pt 0 0 0; margin: 0; display: block;">
</td>
</tr>
</table>
</td>
</tr>
</table>

你应该能够针对Mac版的Outlook:

@media (prefers-color-scheme: dark) {
.go-red { color:#FF0000!important; }
}

只需将go-red类添加到p标签中。我在OL Office 365 Dark (macOS)中通过Litmus测试了这个

最新更新