canvas原理的underline.js解决下划线重叠问题实例页面

效果：

我是一段文字，链接地址是下划线。

I am a paragraph of text, the link address is underline line.

代码：

CSS代码：

.underline {
    display: inline-block;
    text-decoration: none;
}
.underline canvas {
    position: absolute;
    transform: translate(-100%,0);
}

HTML代码：

<p>我是一段文字，<a href class="underline">链接地址</a>是下划线。</p>
<p><span class="underline">I am a paragraph of text, the link address is underline line.</span></p>