带有字形和不同字体的文本的 ASP.NET Actionlink [英] ASP.NET Actionlink with glyphicon and text with different font

问题描述

我想用 @Html.ActionLink 显示一个按钮，但我需要在文本中包含我的应用程序字体.

I want to present a button with @Html.ActionLink but i need to have my application font in the text.

使用此代码:

<span>
    @Html.ActionLink("  Create New", "Create", null, new { @class = "btn btn-warning glyphicon glyphicon-plus-sign" })
</span>

我得到了我的按钮，但 新建 文本与 glyphicon 字体系列一起出现.

I get my button but the Create New text appears with the glyphicon font-family.

将 glyphicon 类放在 span 中不会改变任何东西

Putting the glyphicon classes in the span doesn't change anything

推荐答案

您不应将 glyphicon 类添加到 a 标签中.

You should not add the glyphicon class to the a-tag.

来自 Bootstrap 网站:

From the Bootstrap website:

不要与其他成分混合图标类不能直接与其他组件组合.它们不应与同一元素上的其他类一起使用.相反，添加一个嵌套的 并将图标类应用到 .

Don't mix with other components Icon classes cannot be directly combined with other components. They should not be used along with other classes on the same element. Instead, add a nested <span> and apply the icon classes to the <span>.

仅用于空元素图标类应该只用于不包含文本内容且没有子元素的元素.

Only for use on empty elements Icon classes should only be used on elements that contain no text content and have no child elements.

换句话说，要按照您想要的方式工作的正确 HTML 是:<a href="#" class="btn btn-warning">test <span class="glyphicon glyphicon-加号"></span></a>

In other words the correct HTML for this to work the way you want would be: <a href="#" class="btn btn-warning">test <span class="glyphicon glyphicon-plus-sign"></span></a>

这使得 Html.ActionLink 助手不合适.相反，您可以使用以下内容:

This makes the Html.ActionLink helper unsuitable. Instead you could use something like:

<a href="@Url.Action("Action", "Controller")" class="btn btn-warning">
    link text 
    <span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>
</a>

这篇关于带有字形和不同字体的文本的 ASP.NET Actionlink的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！