HTML锚点标签转为@Html.ActionLink后图标字体显示异常，寻求解决方案

嘿，我懂你碰到的麻烦了！你原来的问题出在@Html.ActionLink的工作机制上——它默认会把你传入的第一个参数（链接文本）做HTML编码，所以你直接把<i>标签塞进去的话，它不会被浏览器当成HTML元素渲染，反而会变成纯文本显示在页面上，自然就看不到图标了。

先看你原来代码的问题： #

你写的这段代码不仅语法有问题（多了多余的单引号和空格），更关键的是ActionLink会把整个字符串转义：

@Html.ActionLink("'far fa - arrow - alt - circle - right'></i> Next1", "ActionName", new { controller = "MyController", id = 1 }, new { @class = "btn btn-primary next-step" })

最终页面上会显示类似'<i class="far fa-arrow-alt-circle-right"></i> Next1'的纯文本，而不是你想要的图标+按钮效果。

推荐的解决方案（最直观，和原始HTML效果完全一致） #

放弃用@Html.ActionLink，改用手动写<a>标签，配合@Url.Action生成正确的路由地址。这样既能保留原始HTML的结构，又能保证路由的正确性：

<a href="@Url.Action("ActionName", "MyController", new { id = 1 })" class="btn btn-primary next-step">
    <i class="far fa-arrow-alt-circle-right"></i> Next1
</a>

这种写法和你原来的HTML几乎一模一样，只是把href="#"替换成了Url.Action生成的真实路由地址，图标、样式和文字都会和原始效果完全一致。

如果你一定要用@Html.ActionLink的话 #

可以用MvcHtmlString.Create()来绕过HTML编码，不过这种写法不如上面的直观，维护起来也麻烦：

@Html.ActionLink(
    MvcHtmlString.Create("<i class='far fa-arrow-alt-circle-right'></i> Next1").ToString(),
    "ActionName",
    "MyController",
    new { id = 1 },
    new { @class = "btn btn-primary next-step" }
)

总结 #

最稳妥、最易维护的方式还是手动写<a>标签+Url.Action，这样你能完全控制HTML结构，确保和原始UI效果一致，也避免了ActionLink带来的编码问题。

内容的提问来源于stack exchange，提问作者Bit2Dev