天道酬勤,学无止境

没有 Google 字体的 Bootstrap CSS(Bootstrap CSS without Google Fonts)

问题

我正在编写一个简单的离线 Web 应用程序来配置设备(类似于无线路由器设置页面)。

连接到我的设备的计算机没有互联网连接,它将从我的设备上运行的服务器加载页面。

我已经使用 Bootstrap.css 的 Bootswatch 覆盖来构建页面,因为这是我熟悉的库。 但是,我的页面加载挂起,因为浏览器尝试检索 Google 字体但显然不能。

是否有不使用 Google 字体的 Bootstrap.css 版本,或者有什么方法可以覆盖它们?

回答1

您不能简单地从您下载的自定义 bootswatch 主题中删除第一行(假设您下载了 css 文件,例如 http://bootswatch.com/flatly/bootstrap.css)?

@import url("https://fonts.googleapis.com/css?family=Lato:400,700,400italic");

这应该使它回落到它可以使用的字体。

回答2

你为什么不下载你想使用的字体,即 OpenSans,把它放在一个名为“fonts”的子文件夹或类似的文件夹中,然后使用类似的东西......

@font-face {
  font-family: "OpenSans";
  src: url("/fonts/Opensans.ttf");
}
回答3

如果您出于任何原因不想编辑 bootstrap css(对我而言,它是由 wro4j 从 jar 文件注入的),那么您可以使用所需的 css 覆盖您自己的 css 中的“font-family”,然后包含该 css 文件在您的 Web 应用程序中具有更高的优先级。

@font-face {
font-family: "myFont";
src: url("/fonts/myFont.ttf");
}

body {
  font-family: myfont !important;
}

PA:如果你使用的是 wro4j,那么你的新 css 必须高于 bootstrap webjar。 这是一个示例 wro.xml:

<group name="main">
  <css>/styles/my.css</css>
  <css>classpath:META-INF/resources/webjars/bootswatch-spacelab/3.3.1+2/css/bootstrap.min.css</css>
</group>

受限制的 HTML

  • 允许的HTML标签:<a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • 自动断行和分段。
  • 网页和电子邮件地址自动转换为链接。

相关推荐
  • 如何使用Google的字体更改Bootstrap默认字体系列?(How can I change the Bootstrap default font family using font from Google?)
    问题 我正在创建一个博客站点,并且想要更改Bootstrap字体。 在我的导入CSS标头中,我添加了此字体 <link href='http://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'> 如何将其用作引导程序默认字体? 回答1 首先,您不能以这种方式将字体导入CSS。 您可以在HTML头中添加以下代码: <link href='http://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'> 或将其导入CSS文件中,如下所示: @import url("http://fonts.googleapis.com/css?family=Oswald:400,300,700"); 然后,在CSS中,您可以编辑主体的字体系列: body { font-family: 'Oswald', sans-serif !important; } 回答2 如果使用Sass,则会使用!default定义Bootstrap变量,您将在其中找到字体系列。 您可以在包括Bootstrap Sass文件之前在自己的.scss文件中设置变量,并且
  • 谷歌字体不适用于引导程序(Google font not working with bootstrap)
    问题 我正在尝试在页面上使用 Google 字体。 在我的 html 中,我使用了: <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'> 在我的 CSS 中: @import url('http://fonts.googleapis.com/css?family=Open+Sans'); 仍然当我使用带有 font-family 属性的“Open Sans”时,它仍然使用 Arial。 body { background-color: #F1F1F2; font-family: "Open Sans", Arial; } 回答1 在任何网页上使用 google 字体都非常简单,您可以异步加载字体。 如果您不使用 Google 字体提供的直接代码,只需加载以下网址: http://fonts.googleapis.com/css?family=Open+Sans:400,600 您将获得源代码 (CSS)。 现在,将显示的代码复制并粘贴到您网站的 CSS 源中。 然后,您可以使用以下方法在您的网页上使用您选择的谷歌字体: body { background-color: #F1F1F2; font-family: 'Open
  • 为什么谷歌字体粗细不起作用?(Why is google font weight not working?)
    问题 我正在尝试将h1更改为font-weight: 300 。 除非我这样做: .h1{ font-weight: 300; } 什么都没发生! 因此,为了测试其他文本元素的字体粗细,我将整个封装容器container-fluid设置为font-weight: 200 : .container-fluid{ font-family: 'Work Sans', sans-serif; font-weight: 200; } ...只有几个元素改变了它们的font-weight (见这里:JFiddle)。 其余的保持不变。 为什么会这样? 如果有人可以告诉我如何更改h1的字体粗细,那将不胜感激! 如果相关,我正在使用 Chrome。 但我也在 Safari 上运行了我的 JFiddle,结果是一样的。 我在CSS 文件的顶部导入了我需要的所有字体粗细: /*import custom font*/ @import 'http://fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700,800,900'; 我尝试使用http:正如这篇文章所建议的那样。 没有改变任何东西。 回答1 在引导 css 文件中将font-weight属性设置为 500 到以下元素: .h1, .h2, .h3, .h4,
  • 使用grunt构建项目时Fontawesome无法正常工作(Fontawesome is not working when project is built with grunt)
    问题 我正在使用很棒的字体库字体。 当项目没有用grunt构建/丑化时,它可以工作。 但是,当我用粗鲁的方式构建项目时,它就无法正常工作。 我在控制台中收到此错误:... / fonts / fontawesome-webfont.woff?v = 4.0.3 404(未找到) 我已经将这个项目与约曼搭在一起。 这是我在index.html中的引用 <!-- build:css styles/fontawesome.css --> <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css"> <!-- endbuild --> 有什么想法可能是错误的吗? 更新我需要将文件夹/ bower_components / font-awesome / fonts复制到dist / fonts。 这需要在grunt文件中完成。 可能在“复制”选项下 copy: { dist: { files: [{ expand: true, dot: true, cwd: '<%= yeoman.app %>', dest: '<%= yeoman.dist %>', src: [ '*.{ico,png,txt}', '.htaccess', 'bower_components/**/*',
  • sass bootstrap 集成未显示字形(glyphicons not showing with sass bootstrap integration)
    问题 我使用本教程将引导程序集成到我的项目中: https://laravel-news.com/2015/10/setup-bootstrap-sass-with-laravel-elixir/ 这会在 css 文件夹中放置一个 app.css 文件。 但是,如果我尝试使用字形,它们就不会出现。 所以我尝试像这样修改 elixir 文件: elixir(function(mix) { mix.sass('app.scss') .browserify('app.js') .copy('node_modules/bootstrap-sass/assets/fonts', 'public/css/fonts') }); 字体文件夹被复制到 public/css/fonts 下,但没有显示图标。 我在这里缺少什么? 有什么线索吗? 在我的 app.css 中,路径似乎是正确的,例如: src: url("fonts/bootstrap/glyphicons-halflings-regular.eot"); 回答1 我在全新安装 Laravel 5.2 时遇到了同样的问题。 我所做的只是检查了浏览器中的请求路径: ../build/fonts/bootstrap/glyphicons-halflings-regular.woff2 所以我只是在 gulp.js 中添加了这个: mix
  • Bootstrap3 - Glyphicons 不显示在 Chrome 中,只显示(Bootstrap3 - Glyphicons are not displayed in Chrome, only)
    问题 奇怪的是,在 Chrome v31 中没有显示 Bootstrap3 字形(显示一个小方块)。 但是,在 FF v26、Opera v18、Safari v5.1 和 IE v10 中运行良好。 此外,在 Android 4.x - Chrome 和 FF 中运行良好。 用简单的代码测试: <span class="glyphicon glyphicon-adjust"></span> 请帮忙。 非常感谢! 环境:Windows 8.0 回答1 与其解决你的问题,我更愿意教你如何解决你自己的问题。 右键单击元素并选择“检查元素”。 这将打开一个窗口,向您显示有关 html 和应用于它的 CSS 的一些有用信息。 如果是精灵图像(如 Bootstrap 2),请查看右侧的 CSS,寻找最顶部(未划掉)的background-image 。 请参阅精灵图像的 url。 如果它是一个字形(如在 Bootstrap 3 中),则查找font-family 。 转到网络选项卡。 您可能需要刷新页面以获取有用的内容。 查找它加载该精灵图像或字体的位置(例如 glyphicons-halflings-regular.woff)。 如果它说它的状态为“304”,则意味着它是从缓存中加载的。 在这种情况下,清除缓存并重新加载页面可能会解决您的问题。 如果它不是“304”状态
  • Bootstrap 3 Glyphicons无法正常工作(Bootstrap 3 Glyphicons are not working)
    问题 我下载了bootstrap 3.0,但无法使用字形图标。 我收到某种“ E003”错误。 任何想法为什么会这样? 我在本地和在线都尝试过,但仍然遇到相同的问题。 回答1 我遇到了同样的问题,除了此页面上的隐藏评论之外,找不到任何有关它的信息。 根据Chrome的显示,我的字体文件可以很好地加载,但是图标显示不正确。 我正在回答这个问题,因此有望对其他人有所帮助。 我从Bootstrap 3的定制工具下载的字体文件出了问题。 要获取正确的字体,请转到Bootstrap主页并下载完整的.zip文件。 从那里提取四个字体文件到您的fonts目录,一切应该正常。 回答2 读者注意:关于自定义程序中的错误,请务必阅读@ user2261073的注释和@Jeff的答案。 这很可能是您造成问题的原因。 字体文件未正确加载。 检查文件是否在预期位置。 @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
  • 只有带有 Phantomjs 1.7/1.8/1.9 的 Courier 字体,也许是 CSS 特定的(Only Courier-Fonts with Phantomjs 1.7/1.8/1.9, perhaps CSS specific)
    问题 自从更新到 OpenSuse 12.2 后,我不能再使用 phantomjs(从 1.5 更新到 1.8.1 64 位版本)来创建屏幕截图。 问题是缺少对 serif/sansserif 字体的字体支持。 仅使用类似 courier/monospace 的字体。 此外,phantomjs 渲染速度非常慢(5 秒以上--> 已解决)。 我尝试安装诸如 google-droid-fonts、free-ttf-fonts、bitstream-vera-fonts、freetype、font-config 之类的软件包 - 但唯一的结果是使用了其他一些丑陋的字体。 有没有人知道如何配置 OpenSuse 12.2 以启用一些可用字体(如 googles droid 字体)作为 phantomjs 的后备? 还是我错过了安装一个重要的 font-render-lib(慢渲染)? 更新 从源代码构建解决了性能问题安装“Arial”等微软核心字体没有帮助 “fc-match”返回正确的结果 “strace -e open”显示,phantomjs 可以访问 /etc/fonts 下的配置 更新 2 问题似乎源于我项目的 CSS。 尝试不同的网站,大多数都呈现得很好。 测试版 PhantomJS 1.9 具有相同的结果重现错误的公共 URL:http://www.berlin.de
  • 在 yeoman/angular grunt build 中未更新对字体(font-awesome)资源的引用(References to font (font-awesome) resources are not updated in yeoman/angular grunt build)
    问题 我知道关于这个的 SO 线程(我已经在下面链接了它们),但不幸的是我无法与他们解决这个问题,所以请允许我提出这个问题:-) 我已经使用 Yeoman 引导了一个 AngularJS 项目,因此依赖于使用 bower.js 和 SCSS 的 grunt.js 构建。 我想使用来自 bootstrap-sass-official 的 font-awesome 和 glyphicons-halflings-regular。 运行“grunt serve”时一切正常,但是当我想创建一个用于分发的文件集时,对字体文件的引用没有按应有的方式更新。 main.scss 包含 $icon-font-path: "../bower_components/bootstrap-sass-official/vendor/assets/fonts/bootstrap/"; @import 'bootstrap-sass-official/vendor/assets/stylesheets/bootstrap'; $fa-font-path: "../bower_components/font-awesome/fonts/"; @import "font-awesome/scss/font-awesome"; 但是 dist/styles/123456.main.css 中的结果是像这样的引用
  • Bootstrap Glyphicons 如何工作?(How do Bootstrap Glyphicons work?)
    问题 我知道一些 CSS 和 HTML 的基础知识,有时会使用它们,但我不是专业人士,我很好奇 Bootstrap Glyphicons 是如何工作的。 我的意思是 Bootstrap zip 文件中没有图像,那么图像来自哪里? 回答1 在 Bootstrap 2.x 中,Glyphicons 使用了图像方法 - 使用您在问题中提到的图像。 图像方法的缺点是: 您无法更改图标的颜色您无法更改图标的背景颜色您无法增加图标的大小 所以很多人没有使用 Bootstrap 2.x 中的字形,而是使用了 Font-awesome,因为它使用了没有这些限制的 SVG 图标。 在 Bootstrap 3.x 中,Glyphicons 使用字体方法。 使用字体来表示图标比使用图像更有优势: 可扩展 - 无论客户端设备的分辨率如何,都能很好地工作可以用 CSS 改变颜色可以做传统图标可以做的一切(例如改变不透明度、旋转等) 可以添加笔触、渐变、阴影等。 转换为文本(带连字) 连字由屏幕阅读器读取将图标更改为字体就像更改 CSS 中的字体系列一样简单 您可以在此处查看图标的字体方法可以做什么。 所以在 Bootstrap 发行版中,你可以看到 glyphicon 字体文件: fonts\glyphicons-halflings-regular.eot fonts\glyphicons
  • 为什么 Yeoman 在没有字形的情况下构建?(Why does Yeoman build without glyphicons?)
    问题 我正在开发一个webapp生成器,在运行grunt我得到了一个可以正确显示字体的功能性应用程序。 但是,当我检查dist/目录时,我没有得到任何字体文件。 文档指出grunt命令build the application for deployment ,但dist/目录不是自治的。 Gruntfile.js 配置 我的copy:dist任务如下: dist: { files: [{ expand: true, dot: true, cwd: '<%= yeoman.app %>', dest: '<%= yeoman.dist %>', src: [ '*.{ico,png,txt}', '.htaccess', 'images/{,*/}*.{webp,gif}', 'styles/fonts/{,*/}*.*' ] }] }, 所以它确实复制字体,但不是bower_components/sass-bootstrap/dist/fonts/ 构建内容 这是我运行grunt build后得到的所有信息 ./dist ├── 404.html ├── favicon.ico ├── index.html ├── robots.txt ├── scripts │ ├── coffee.js │ ├── plugins.js │ ├── vendor.js │ └── main
  • Bootstrap CSS without Google Fonts
    I am writing a simple offline web app to configure a device (think similar to a wireless router setup page). The computer that is connected to my device won't have an internet connection, it will be loading the page from a server running on my device. I've built the page using a Bootswatch override of Bootstrap.css because that is a library I'm familiar with. However, my page load hangs because the browser tries to retrieve Google Fonts but obviously can't. Is there a version of Bootstrap.css which does not use Google Fonts, or is there a way that I can override them?
  • Bootstrap Glyphicons 不使用本地 Bootstrap 版本渲染(Bootstrap Glyphicons not rendering using local Bootstrap version)
    问题 我在 django 中使用引导程序,它适用于所有其他引导程序类,除了像这样的图标类: class="glyphicon glyphicon-download-alt" 右下角有错误的快照: 包含 bootstrap.min.css 文件时的快照: 在执行检查元素时,它包含所有字形,其快照是- 只有在我的 html 文件中链接http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css它才有效; 但是如果我从我的 PC 中包含我的bootstrap.min.css ,它就不起作用。 否则,每个引导类都可以完美运行。 希望你明白我的问题。 提前致谢。 回答1 它不起作用,因为您从 CDN 链接保存了 CSS 文件。 这是行不通的,因为字形链接到相对于该 CSS 文件。 例子: @font-face{ font-family:'Glyphicons Halflings'; src:url(../fonts/glyphicons-halflings-regular.eot); } 这意味着下载的 Bootstrap 文件正在您计算机上的文件夹(您没有)中查找字形。 您需要从官方下载链接正确下载 Bootstrap。 此官方下载包含一个/fonts/目录,其中包含实际的 glyphicon 字体文件。 或者
  • Bootstrap 图标未显示在已发布的 ASP.NET MVC 应用程序中(Bootstrap Icons not showing in published ASP.NET MVC application)
    问题 --- 注意:转到 EDITED 2 部分的摘要 ---- 我有一个 ASP.NT MVC (4) 应用程序。 我将 (twitter) Bootstrap 集成到它。 Bootstrap 运行良好,但在我发布应用程序时图标无法正确显示。 我试图重新发布应用程序但没有成功。 为了澄清起见,我在下面放了一些图片。 当我从 VS2013 运行我的应用程序时,结果是这样的(没关系): 在展位,IE 和 Chrome。 但是当我运行已发布的应用程序时,结果是这样的(这不正常): 铬合金 浏览器 (10) 不知何故,这个问题与评估的 CSS 有关,但我不知道这可能发生在哪一点。 本地应用程序中评估的 css 是这样的(可以): 铬合金 IE 但是在已发布的应用程序中,我有这个(这不行): 铬合金: IE: 有人经历过这种行为吗? 我能做些什么来解决这个奇怪的问题? --------------------------- 编辑 -------------- -------- 我在发布我的应用程序时获得了要包含的字体文件( .eot 、 .svg 、 .ttf和.woff )。 当我访问默认页面(应用程序根http://localhost/ )时,这是显示图标的页面,Chrome 的开发人员工具网络选项卡中显示的文件是: 在包含这些文件之前,我收到了文件的 404 错误
  • 如何在Bootstrap 3.0中使用字形图标(How to use glyphicons in bootstrap 3.0)
    问题 我已经在bootstrap 2.3中使用了glyphicons,但是现在我已升级到bootstrap 3.0。 现在,我无法使用icon属性。 在Bootstrap 2.3中,以下标记有效 <i class="icon-search"></i> 在bootstrap 3.0中,它不起作用。 回答1 图标(字形图标)现在包含在单独的css文件中... 标记已更改为: <i class="glyphicon glyphicon-search"></i> 或者 <span class="glyphicon glyphicon-search"></span> 以下是有关Bootstrap 3的有用更改列表:http://bootply.com/bootstrap-3-migration-guide 回答2 你去了: <i class="glyphicon glyphicon-search"></i> 更多信息: http://getbootstrap.com/components/#glyphicons 顺便提一句。 您可以使用此转换工具,这还将更新图标的代码: 回答3 如果您下载自定义的bootstrap 3发行版,则必须: 从https://github.com/twbs/bootstrap/archive/v3.0.0
  • 资产:安装和资产:转储后Fontawesome字体失败(Fontawesome fonts fail after assets:install and assetic:dump)
    问题 我正在尝试建立一个我正在共享主机上工作的网站,并且一切正常,但是FontAwesome图标因为Symfony找不到它们应该放置的位置。 我按照以下步骤将网站移至生产共享主机: 由于SH不允许符号链接,因此将资产发布为硬拷贝,因此我运行以下命令assets:install 通过运行以下命令来发布Assetic处理的资产: assetic:dump (dev)和assetic:dump --env=prod (prod) 但这是行不通的,因为我一直在Firebug遇到此错误: "NetworkError: 404 Not Found - http://tanane.com/bundles/backend/img/mybg.png" "NetworkError: 404 Not Found - http://tanane.com/bundles/backend/fonts/fontawesome-webfont.woff?v=4.1.0" "NetworkError: 404 Not Found - http://tanane.com/bundles/backend/fonts/fontawesome-webfont.ttf?v=4.1.0" 在本地主机,按照相同的步骤,一切正常,因此我不知道是权限问题还是其他问题。 这就是我在base.html.twig定义资产的方式: {%
  • 如何让字形在 twitter-bootstrap 中工作?(How to get glyphicons working in twitter-bootstrap?)
    问题 我有本地存储的引导程序文件: <link rel="stylesheet" href="/bootstrap/3.2.0/css/bootstrap.min.css"> 和 <script src="/bootstrap/3.2.0/js/bootstrap.min.js"></script> 但是当我这样做时: <span class="glyphicon glyphicon-print" aria-hidden="true"></span> 我得到一个小的方形字符,例如当客户端没有正确的字体时显示。 我在这里读到有单独的 CSS,但链接已损坏。 任何想法如何解决这个问题? 回答1 找到了: 需要在本地创建: /bootstrap/3.2.0/fonts/glyphicons-halflings-regular.eot /bootstrap/3.2.0/fonts/glyphicons-halflings-regular.woff /bootstrap/3.2.0/fonts/glyphicons-halflings-regular.ttf /bootstrap/3.2.0/fonts/glyphicons-halflings-regular.svg 我从这里采购: http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/fonts
  • 字形渲染为空框(Glyphicons rendering as empty box)
    问题 我正在使用带有Glyphicons的出色的Twitter引导程序库,但是所有图标都呈现为空白方块,如下所示: 我已经将Glyphicons字体上传到了我的网络根目录,并更改了bootstrap.css文件以指向它们的正确位置,这已经得到了验证,因为它们在Chrome的开发工具中有200 OK请求: 这是我正在使用的标记: <a href="http://www.mysite.com/download" class="btn btn-primary"><span class="glyphicon glyphicon-star"></span> Download to Computer</a> 有什么想法为什么字体可能呈现为空框? 关于StackOverflow的先前答案均指向字体的错误路径,此处不是这种情况,因为路径正确。 回答1 并不是真正的解决方案,但我最终只使用了Bootstrap CDN:http://www.bootstrapcdn.com/ 回答2 我遇到了同样的问题,并且能够解决! 在IIS中,我为woff和woff2设置Mime类型,如下所示: .woff application/x-font-woff .woff2 application/font-woff2 在页面的CSS中,我从引导Glyphicon下载中为woff和woff2创建了一个加载的字体:
  • 为什么font-awesome可以在localhost上运行而不能在Web上运行?(Why font-awesome works on localhost but not on web ?)
    问题 我在我的项目(mvc/asp.net)使用了很棒的字体。 我的问题是,我在调试项目并检查localhost ,字体真棒图标没有问题。 但是,当发布该网站并在网上检查时,我看到的是小盒子,而不是图标。 我确定它放在正确的目录中(放置css文件的位置)。 我找不到任何适当的解决方案。 顺便说一下,按钮也没有问题。 它们都还可以,但是图标不见了。 谢谢 回答1 我刚刚加载了您的网页,并检查了萤火虫的网络标签。 您的以下网址返回了404: http://www.senocakonline.com/Content/font/fontawesome-webfont.woff http://www.senocakonline.com/Content/font/fontawesome-webfont.ttf 我认为那些丢失是您的图标未显示的原因。 更新:23.10.2015使其可用,只需将此代码添加到您的WebConfig中: <system.webServer> <staticContent> <mimeMap fileExtension="woff" mimeType="application/font-woff" /> <mimeMap fileExtension="woff2" mimeType="application/font-woff" /> </staticContent>
  • Bootstrap 3无法正确显示Glyphicon(Bootstrap 3 unable to display glyphicon properly)
    问题 我正在从Bootstrap 2.3迁移到Bootstrap 3,一切正常。 但是,当我尝试添加一些图标时,图标字体无法正确显示。 我试图在这里查看http://bootply.com/61521,仅正确显示了“ .glyphicon-envelope”。 其他显示如“ E001”等。 我该如何解决这个问题? 对于其他浏览器,字形显示正确,只有Firefox无法正确显示。 回答1 好的,以上问题未能解决我的问题。 我的字体文件夹与引导css和js文件夹位于同一位置(例如/ theme / bootstrap3 / ..),但是它正在根目录中查找字体文件夹(例如/fonts/glyph..woff) 对我来说,解决方案是将@ icon-font-path变量设置为正确的相对路径: 例如@ icon-font-path:“ fonts /”; 回答2 您是否选择了Bootstrap的定制版本? 自定义软件包中包含的字体文件已损坏(请参阅https://github.com/twbs/bootstrap/issues/9925),这是一个问题。 如果您不想使用CDN,则必须手动下载它们,并用下载的字体替换自己的字体: https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular