在 <a> 标签内为 <img> 标签添加下划线

Question

我有一个 <a> 标签，里面既有文字又有图片。我想让图片和文字加下划线，如下图：

不过我一直得到的是：

如您所见，下划线没有延伸到箭头下方。这是我的代码：

  <a target="_blank" href="http://url.com" style="text-decoration:underline;color:#000001;" >Call To Action <img src="image/path/triangle.png" border="0" /></a>

现在我不能在包装容器上放置边框底部，因为在移动设备上我需要为文本加下划线，而这只会在文本底部放置边框。

Answer 1

将两个标签包含在

    <span style="text-decoration:underline">

标签。

Answer 2

您需要使用 border-bottom 样式 a 并删除 text-decoration:underline

<a target="_blank" href="http://url.com" style="border-bottom:1px solid red;text-decoration:none;color:#000001;">Call To Action <img src="//lorempixel.com/20/20" border="0" /></a>

Answer 3

超链接标签没有关闭标签</a>，如果要关闭它，请这样设置：

<a target="_blank" href="http://url.com" style="text-decoration: underline; color: #000001;">
  Call To Action <img src="image/path/triangle.png" border="0" />
</a>

参考：

此外，我建议您将设计与内容分开。

在 <a> 标签内为 <img> 标签添加下划线

Add Underline To <img> tag inside <a> tag

html

css

html-email