在 fonts 文件夹内可以找到字体图标,它包含了下列这些文件: glyphicons-halflings-regular.eot glyphicons-halflings-regular.svg glyphicons-halflings-regular.ttf...@font-face { font-family: 'Glyphicons Halflings'; src: url('...../fonts/glyphicons-halflings-regular.eot'); src: url('../fonts/glyphicons-halflings-regular.eot?.../fonts/glyphicons-halflings-regular.woff') format('woff'), url('...../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg'); } .glyphicon { position
可以使用Bootstrap 框架的 glyphicon 类,可以基于项目的 Bootstrap 来免费使用Glyphicons Halflings 提供的图标库。...查看可以使用的图标列表https://www.runoob.com/try/demo_source/bootstrap3-glyph-icons.htm 字体图标(Glyphicons) 添加图标使用示例
/fonts/glyphicons-halflings-regular.eot'); /* IE9 Compat Modes */ src: url('..../fonts/glyphicons-halflings-regular.eot?.../fonts/glyphicons-halflings-regular.woff') format('woff'), /* Modern Browsers */ url('..../fonts/glyphicons-halflings-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('..../fonts/glyphicons-halflings-regular.svg#glyphicons') format('svg'); /* Legacy iOS */ } .hd-r
' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/fonts/glyphicons-halflings-regular.svg...' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/fonts/glyphicons-halflings-regular.ttf...' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/fonts/glyphicons-halflings-regular.woff...' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/img/glyphicons-halflings-white.png...' Copying '/opt/py3/lib/python3.6/site-packages/rest_framework/static/rest_framework/img/glyphicons-halflings.png
/jumpserver/apps/static/fonts/fontawesome-webfont.woff2' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.eot...' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.svg' Copying '/opt/jumpserver.../apps/static/fonts/glyphicons-halflings-regular.ttf' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.woff...' Copying '/opt/jumpserver/apps/static/fonts/glyphicons-halflings-regular.woff2' Copying '/opt/jumpserver
JS文件 │ ├── bootstrap.js // 未压缩的文件 │ └── bootstrap.min.js // 压缩之后的文件 └── fonts/ // 字体文件 ├── glyphicons-halflings-regular.eot...├── glyphicons-halflings-regular.svg ├── glyphicons-halflings-regular.ttf ├── glyphicons-halflings-regular.woff...└── glyphicons-halflings-regular.woff2
图片.png Glyphicons Halflings 官方网址:http://glyphicons.com/ http://v3.bootcss.com/components/ 描述:Glyphicons...为了表示感谢,希望你在使用时尽量为 Glyphicons 添加一个友情链接 使用案例: ?
└── fonts/ ├── glyphicons-halflings-regular.eot // 字体 (字体图标) ├── glyphicons-halflings-regular.svg...├── glyphicons-halflings-regular.ttf ├── glyphicons-halflings-regular.woff └── glyphicons-halflings-regular.woff2
/dist/fonts/glyphicons-halflings-regular.eot", "..../dist/fonts/glyphicons-halflings-regular.svg", "..../dist/fonts/glyphicons-halflings-regular.ttf", "..../dist/fonts/glyphicons-halflings-regular.woff" ], ...
--字体图标--> ├── glyphicons-halflings-regular.eot ├── glyphicons-halflings-regular.svg ├── glyphicons-halflings-regular.ttf... ├── glyphicons-halflings-regular.woff └── glyphicons-halflings-regular.woff2 *bootstrap.css
Glyphicons:包括200个符号字体格式图表集合,由Glyphicons提供,Glyphicons Halflings 一般是收费的,但是经过Bootstrap和Glyphicons作者之间的协商...如下是部分Glyphicons内容: ? 利用这几种图标内容,我们引入下面几种样式就可以了。...对于Glyphicons来说,它的样式定义也是很类似的,如下所示。 ?
bootstrap-theme.min.css.map ├── js/ │ ├── bootstrap.js │ └── bootstrap.min.js └── fonts/ ├── glyphicons-halflings-regular.eot...├── glyphicons-halflings-regular.svg ├── glyphicons-halflings-regular.ttf ├── glyphicons-halflings-regular.woff...└── glyphicons-halflings-regular.woff2 用于生产环境的 Bootstrap即为预编译文件,可以直接使用到任何 web 项目中。...href="#">菜单1 菜单2 菜单3 Glyphicons...字体图标 Bootstrap中包括 250 多个来自 Glyphicons字体图标, 你可以通过它来实现网页中的图标效果。
└── bootstrap-theme.min.css.map├── js/│ ├── bootstrap.js│ └── bootstrap.min.js└── fonts/ ├── glyphicons-halflings-regular.eot... ├── glyphicons-halflings-regular.svg ├── glyphicons-halflings-regular.ttf ├── glyphicons-halflings-regular.woff... └── glyphicons-halflings-regular.woff2 基础模板和引入的文件如下 <!
遇到的问题 1.当我们在resources目录下,创建fonts文件夹,把Bootstrap所需要的glyphicons-halflings-regular.ttf、glyphicons-halflings-regular.woff...、glyphicons-halflings-regular.woff2字体格式文件拷贝进来。
│ ├── bootstrap.min.css // 核心CSS样式压缩文件 │ └── bootstrap.min.css.map ├── fonts // 字体文件 │ ├── glyphicons-halflings-regular.eot...│ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ ├── glyphicons-halflings-regular.woff...│ └── glyphicons-halflings-regular.woff2 └── js // JS文件 ├── bootstrap.js ├── bootstrap.min.js
vmc-arrow-left:after, .vmc-arrow-right:after { content: ''; display: inline-block; font-family: 'Glyphicons...'icomoon'; line-height: 1; speak: none; -webkit-font-smoothing: antialiased; } 也就是说:字体“Glyphicons
│ └── bootstrap-theme.min.css.map ├── js/ │ ├── bootstrap.js │ └── bootstrap.min.js └── fonts/ ├── glyphicons-halflings-regular.eot...├── glyphicons-halflings-regular.svg ├── glyphicons-halflings-regular.ttf ├── glyphicons-halflings-regular.woff...└── glyphicons-halflings-regular.woff2 Bootstrap 源码 Bootstrap 源码包含了预先编译的 CSS、JavaScript 和图标字体文件,并且还有
. ├── css │ ├── bootstrap.css │ ├── bootstrap.min.css ├── fonts │ ├── glyphicons-halflings-regular.eot...│ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ ├── glyphicons-halflings-regular.woff...│ └── glyphicons-halflings-regular.woff2 └── js ├── bootstrap.js └── bootstrap.min.js 也有类似正则匹配的选项
领取专属 10元无门槛券
手把手带您无忧上云