在Bootstrap项目MVC 5中添加Glyphicons
，可以通过以下步骤完成：
- 首先，确保你已经在MVC 5项目中引入了Bootstrap框架。你可以通过在项目的
<head>标签中添加以下代码来引入Bootstrap的CSS文件和JavaScript文件：
<link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>- 确认你已经下载了Glyphicons字体文件。你可以在Bootstrap官方网站的下载页面中找到Glyphicons字体文件的下载链接。
- 将下载的Glyphicons字体文件解压，并将解压后的
fonts文件夹拷贝到你的MVC 5项目的根目录下。 - 在你的MVC 5项目中，找到
Content文件夹，如果没有则创建一个。在Content文件夹中创建一个名为bootstrap-custom.css的CSS文件。 - 打开
bootstrap-custom.css文件，并添加以下代码：
@font-face {
font-family: 'Glyphicons Halflings';
src: url('../fonts/glyphicons-halflings-regular.eot');
src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'),
url('../fonts/glyphicons-halflings-regular.woff') format('woff'),
url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'),
url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}- 保存并关闭
bootstrap-custom.css文件。 - 在你的MVC 5项目中，找到
Views文件夹，然后找到你想要添加Glyphicons的视图文件。 - 在视图文件中，使用Bootstrap的CSS类来添加Glyphicons。例如，如果你想在一个按钮上添加一个图标，可以使用以下代码：
<button type="button" class="btn btn-default">
<span class="glyphicon glyphicon-search"></span> 搜索
</button>在上面的代码中，glyphicon glyphicon-search是一个Bootstrap提供的搜索图标的CSS类。
- 保存并运行你的MVC 5项目，你应该能够看到添加的Glyphicons图标在页面上显示出来。
总结：
在Bootstrap项目MVC 5中添加Glyphicons，你需要引入Bootstrap框架的CSS和JavaScript文件，下载并拷贝Glyphicons字体文件，创建一个自定义的CSS文件来定义Glyphicons字体的路径，然后在视图文件中使用相应的CSS类来添加Glyphicons图标。
相关·内容
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频活动推荐
腾讯云开发者
