如何在.NET 6 Blazor应用中使用Bootstrap Icons?
.NET 6 Blazor中Bootstrap Icons不生效的解决办法
- 你用的是旧版Bootstrap Glyphicons的类名(
glyphicon glyphicon-chevron-left),但Bootstrap Icons是独立的图标库,类名规则完全不同,且需确保正确引入资源。 - 步骤1:安装Bootstrap Icons
通过NuGet包管理器安装Bootstrap.Icons,安装完成后,项目的wwwroot/lib/bootstrap-icons/font目录下会出现对应的CSS文件。 - 步骤2:在布局文件中引入样式
在Blazor WebAssembly的wwwroot/index.html或Blazor Server的Pages/_Layout.cshtml里添加样式引用:<link href="~/lib/bootstrap-icons/font/bootstrap-icons.min.css" rel="stylesheet" /> - 步骤3:替换正确的图标类名
Bootstrap Icons的类名格式为bi bi-图标名称,你的左箭头按钮代码应修改为:<button type="button" class="btn btn-secondary bi bi-chevron-left"></button>
内容的提问来源于stack exchange,提问作者az0009990
相关产品推荐
相关产品推荐

