如何更改 Blazor 应用程序中的默认图标提供程序？答案

【问题标题】：How to change the default icon provider in Blazor app?如何更改 Blazor 应用程序中的默认图标提供程序？
【发布时间】：2020-01-09 07:20:43
【问题描述】：

当您第一次创建 Blazor 项目时，默认图标提供程序是 Iconify，其打开的 icon pack。

如何更改图标提供程序？

大多数网站都提供了一些 JavaScript 以包含在 html 页面中，我不使用这些 Blazor 页面。

我需要做什么来切换我的提供商？

【问题讨论】：

每个人都有自己的资产需要被引用。你试过什么？尝试添加您要使用的内容、尝试过的内容以及遇到的错误

标签： c# css icons blazor

【解决方案1】：

图标来自 site.css

的 @import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

导入不同的图标

我使用了 Material Icons

1.site.css中的导入素材图标 @import url('https://fonts.googleapis.com/icon?family=Material+Icons');

2.使用材质图标

例子

    <ul class="nav flex-column">
        <li class="nav-item px-3">
            <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
                <i class="material-icons">
                    accessibility
                </i> Home
            </NavLink>
        </li>
        <li class="nav-item px-3">
            <NavLink class="nav-link" href="counter">
                <i class="material-icons">autorenew</i>
                Counter
            </NavLink>
        </li>
    </ul>
</div>`


  [1]: https://i.stack.imgur.com/LmyDC.png

【讨论】：

【解决方案2】：

有效的方法是将以下链接放在 head 标签上，然后我就可以获取图标了

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

然后像这样访问图标

<i class="material-icons">face</i>

更多信息请查看document

【讨论】：