【问题标题】:Email Template Link Color wont change电子邮件模板链接颜色不会改变
【发布时间】:2017-12-01 08:26:52
【问题描述】:

我在 Jade 中有一个电子邮件模板,其中包含“链接”,或者基本上是带有 .com 的文本字符串,例如 www.site.com

它们实际上并没有包含在锚标记中,但是当发送电子邮件时,它们会显示为链接。我尝试过设置字体、锚点的样式,并将它们内联或放在内部样式标签中,但似乎没有任何效果。

这就是代码的样子:

<font color='#e64c65'>!{site}</font>

该站点将是一个字符串,就像我之前描述的那样。我尝试将font 更改为a,但它只是删除了所有样式并使字符串成为常规的无样式文本。

任何关于如何解决此问题的想法将不胜感激!

【问题讨论】:

  • 你试过内联样式+重要吗?
  • @TemaniAfif 内联样式 + !important 似乎对我也不起作用:/
  • 如果内联样式 style="place styles here" 不起作用,那么它取决于客户端。 color="" 不是内联样式。
  • 通常电子邮件客户端会在锚标记中包装文本,这似乎是链接。而是自己执行此操作,然后使用style 属性声明您的规则inline。如果这不起作用,请使用!important 声明,如果这也不起作用,请将内部文本包装在 another 任意标记(如span)中并使用 inline 样式,必要时使用!important。以我的经验,最后一个解决方案总是有效的;用任意元素包裹内部文本并设置此元素的样式超出了电子邮件客户端声明的包含锚标记的样式。
  • 如果您还可以检查元素并向我们展示 HTML 是如何呈现的,我们可能会为您提供帮助

标签: html css pug html-email


【解决方案1】:

字体标签已弃用:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/font

尝试使用<span><p> 元素,如下所示:

<span style="color: #e64c65;">!{site}</span>

【讨论】:

  • 我尝试过设置字体、锚点的样式,并将它们内联或放在内部样式标签中,但似乎没有任何效果。
  • 他这么说,但他提供的例子仍然是 ... 写出来也无妨
  • 是的,但问题不在于The font tag is deprecated .. 你可以这么说,但你怎么能确定这个解决方案会奏效,正如 OP 在他已经尝试过的问题中所说的那样。跨度>
  • @TemaniAfif 不同意你的看法。 “我尝试过设置字体样式 [...]”并不能证明他没有测试过 span dommmm 的解决方案。米勒斯特朗?你测试了吗?
  • @GGO 我从这个I have tried styling the font, the anchors, and put them inline or in an internal style tag 了解到,他也尝试了带有a 标签的内联样式。我对这个答案的问题是它只是关注已弃用的标签(当然这是真的),而不是问题的问题。但是让我们看看 Milestrong 会怎么说 :) 我们不要忘记它不是一个普通的 html 网站,它是电子邮件模板
【解决方案2】:

也许 {site} 被一个完整的 a-tag 代替,所以改变字体没有影响。

尝试在 css 中设置 a 标签的样式。

【讨论】:

【解决方案3】:

尝试使用此代码

<p style="color: #e64c65;" color='#e64c65'>!{site}</p>

并在样式标签中写下这段代码::

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;
}

【讨论】:

    【解决方案4】:

    检查该元素后,我发现电子邮件客户端将任何看起来像链接的字符串包含在锚标记内。

    我为解决这个问题所做的不是对 url 字符串使用像 fontspan 这样的包装标签,而是将其直接包含在锚标签中,并使用 !important 的颜色进行内联样式

    我的最终输出如下所示:

    a(href=site style={ color: '#e64e65 !important' }) !{site}

    【讨论】:

      猜你喜欢
      • 2012-08-15
      • 1970-01-01
      • 1970-01-01
      • 2013-10-04
      • 2011-04-15
      • 2023-01-12
      • 1970-01-01
      • 2015-02-01
      • 2016-10-20
      相关资源
      最近更新 更多