,可以通过以下步骤完成:
<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>
fonts
文件夹拷贝到你的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
文件。Views
文件夹,然后找到你想要添加Glyphicons的视图文件。<button type="button" class="btn btn-default">
<span class="glyphicon glyphicon-search"></span> 搜索
</button>
在上面的代码中,glyphicon glyphicon-search
是一个Bootstrap提供的搜索图标的CSS类。
总结:
在Bootstrap项目MVC 5中添加Glyphicons,你需要引入Bootstrap框架的CSS和JavaScript文件,下载并拷贝Glyphicons字体文件,创建一个自定义的CSS文件来定义Glyphicons字体的路径,然后在视图文件中使用相应的CSS类来添加Glyphicons图标。
领取专属 10元无门槛券
手把手带您无忧上云