使用 <span class="glyphicon glyphicon-th-large"> XX文字</span>引入字体图标。一般情况下文字放在span 标签之间,前面加一个空格,获得图标与文字之间的间距。

也可以将文字放在span标签之后。

span标签经常出现在链接中,如将文字放在在span 标签之间,不会出现超链接下划线,如字体图标前面有空格,间距大,也可以将文字放在span标签之后会出现下划线。如前面有空格,间距小。

<div class="panel panel-primary">
<div class="panel-heading">
<h2 class="panel-title"><span class="glyphicon glyphicon-th-large"> 栏目导航</span></h2>
</div>

<div class="list-group">
@{
foreach (var category in Model)
{
string categoryCss = category.Active? "active" : null;
<a href="@Url.Action("List", new { categoryID = category.CategoryID})" class="list-group-item @categoryCss">@category.CategoryName <span class="badge">@category.ArticleCount</span></a>

}

}

</div>

</div>

在很多部件中,

Bootstrap中的字体图标的更多相关文章

  1. Bootstrap<基础十一>字体图标(Glyphicons)

    字体图标(Glyphicons),并通过一些实例了解它的使用.Bootstrap 捆绑了 200 多种字体格式的字形. 获取字体图标 我们已经在 环境安装 章节下载了 Bootstrap 3.x 版本 ...

  2. 如何在移动端app中应用字体图标icon fonts (转)

    原文: http://www.cnblogs.com/willian/p/4166757.html?utm_source=tuicool&utm_medium=referral How to ...

  3. 如何在移动端app中应用字体图标icon fonts

    How to use icon fonts in your mobile apps 在任何APP设计中实现可图形的矢量缩放最完美的方式是使用字体图标. 移动端的设计变的越来越复杂.原因在于多样的屏幕尺 ...

  4. AngularCli项目中添加字体图标(Font)详解

    本文主要讲如何在AngularCli生成的项目中使用字体图标. 一 SVG图标准备 将需要转换为字体图标的图片转换为SVG格式. 这个让项目视觉设计师搞定即可. 二 SVG图标转Font 可以通过Ic ...

  5. 如何在微信小程序中使用字体图标

    微信小程序中,在image标签里,可以在src中引用本地文件,但是background设置背景图或者使用字体图标的时候,却不能引用本地文件,只能用url地址的图片或字体,或者使用base64编码后的格 ...

  6. 初学者--bootstrap(六)组件中的字体图标----在路上(9)

    组件---字体图标 无数可复用的组件,包括字体图标.下拉菜单.导航.警告框.弹出框等更多功能. 1.如何使用:        出于性能的考虑,所有图标都需要一个基类和对应每个图标的类.把下面的代码放在 ...

  7. 在WPF中使用字体图标

    一.源码描述    这是一款基于WPF窗体应用程序的字体图标示例源码,    该源码简单易懂使用于初学者和实战项目应用,    感兴趣的朋友们可以下载看看哦. 二.功能介绍    1.用ICO字体代替 ...

  8. WPF中应用字体图标

    一.什么是字体图标 我们在进行GDI(图形界面)编程的过程中图标是不可少的.近些年随着网络的繁荣和移动应用的繁荣,矢量图的应用越来越火. 矢量图是一种用数学方法描述的.由一系列点和线组成的图,因此相比 ...

  9. vue中引入字体图标报错,找不到字体文件

    在用vue + webpack进行开发的时候,在引用字体图标遇到字体无法加载的问题: 报以下错误 搞了好久没搞定,最后才找到解决方法(还是没有找到原因) 修改字体图标的css中引入字体文件的路径 以前 ...

随机推荐

  1. vs code 使用心得

    Jetbrains 家族的软件适合java,python开发,但是对与rust,shell等的开发,则显得有些臃肿,需要一款轻快的编辑器,经过挑选,在sublime3 与 vs code 中选则了vs ...

  2. msp430项目编程04

    msp430中项目---TFT彩屏显示 1.TFT彩屏工作原理 2.电路原理说明 3.代码(静态显示) 4.代码(动态显示) 5.项目总结 msp430项目编程 msp430入门学习

  3. make only output error/warning message( 编译时,只输出错误信息和警告信息)

    make > /dev/null 这样,正常的信息被重定向输出到/dev/null,错误和警告信息会输出到标准错误设备(standard error,相对于标准输入/输出设备来说).

  4. HDU 1028 整数拆分 HDU 2082 找单词 母函数

    生成函数(母函数) 母函数又称生成函数.定义是给出序列:a0,a1,a2,...ak,...an, 那么函数G(x)=a0+a1*x+a2*x2+....+ak*xk +...+an* xn  称为序 ...

  5. PAT (Advanced Level) 1039. Course List for Student (25)

    map会超时,二分吧... #include<iostream> #include<cstring> #include<cmath> #include<alg ...

  6. 《gis空间分析及应用案例解析》培训总结

    <gis空间分析及应用案例解析>培训总结 来源:常德水情 作者:唐校准 发布日期:2014-01-02       2013年12月2630日由中国科学院计算技术研究所教育中心组织的< ...

  7. [机房合作]—SqlHelper我们又约了

    一.是什么? SqlHelper是一个基于·NET Framework的数据库操作组件,组件中包括数据库操作方法. 二.为什么? 为什么要用SqlHelper类?       1.SqlHelper用 ...

  8. POJ2573 Bridge 经典的过桥问题

    曾经遇到过类似的.纪念一下!这题同一时候也是  ZOJ1877.经典的过桥问题 是有个博客解说的非常好的 戳这里 挺久曾经.遇到过一个基本一样的,那个题目仅仅要求求出 最短时间就可以,如今还有过桥的过 ...

  9. linuxc线程信号-pthread_cond_wait理解

    pthread_cond_wait(pthread_cond_t *cond, pthread_mutex_t*mutex)函数 传入的參数mutex用于保护条件,由于我们在调用pthread_con ...

  10. python菜鸟日记1

    1. 在__init__(self,...)初始化函数中.定义对象的属性,这些属性不用所有写在括号里,括号里的表示定义的时候须要赋初始值的一些属性,而其它不用初始值的属性.能够 直接卸载代码块中,se ...