twitter-bootstrap 向引导程序添加额外的字形

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/23823756/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 20:46:25  来源:igfitidea点击:

Adding extra glyphicons to bootstrap

htmlcsstwitter-bootstrapglyphicons

提问by Kevin Boonekamp

Dear fellow designers/developers

亲爱的设计师/开发人员

I have created 8 extra glyphicons for my bootstrap website. Uploaded them to icomoon and downloaded them as font, this all works perfect.

我为我的引导程序网站创建了 8 个额外的字形。将它们上传到 icomoon 并将它们下载为字体,这一切都很完美。

I am able to add my font to my CSS and use it in HTML withou any problem, but I want to use the font as extra Glyphicons.

我能够将我的字体添加到我的 CSS 并在 HTML 中使用它而没有任何问题,但我想将该字体用作额外的 Glyphicon。

How can I do this?

我怎样才能做到这一点?

回答by G Ravinder

refer to this website which provides the font icons to bootstrap

请参阅此网站,该网站提供引导程序的字体图标

Font-Awesome

字体真棒

download fontawesome here fontawesome.io

在这里下载 fontawesome fontawesome.io

add css file link to your page

将 css 文件链接添加到您的页面

 <link href='/path/to/font-awesome.css' rel='stylesheet'/>

use css classes mentioned in font-awesome.cssstating with 'fa-'

使用font-awesome.css说明中提到的 css 类'fa-'

example: <i class="fa fa-desktop"></i>

例子: <i class="fa fa-desktop"></i>

please copy cssand fontsfolders to same folder

请复制cssfonts文件夹相同的文件夹

回答by WasiF

Steps to use font-Awsome

使用 font-Awsome 的步骤

  1. Download Font-Awsome
  2. Extract .zip file
  3. after extracting, you will get folder i.e. font-awesome-4.5.0
  4. Add this folder by drag and drop to your content or bootstrap folder
  5. Add font-awesome.css file as a reference in your web-page

    <link href="~/Content/font-awesome-4.5.0/css/font-awesome.css" rel="stylesheet" />
    
  6. get icons as told by @G Ravinder i.e.

    <i class="fa fa-desktop"></i>
    <span class="fa fa-desktop"></span>
    
  1. 下载字体-Awsome
  2. 解压 .zip 文件
  3. 解压后,你会得到文件夹,即 font-awesome-4.5.0
  4. 通过拖放到您的内容或引导程序文件夹来添加此文件夹
  5. 在您的网页中添加 font-awesome.css 文件作为参考

    <link href="~/Content/font-awesome-4.5.0/css/font-awesome.css" rel="stylesheet" />
    
  6. 获取@G Ravinder 所说的图标,即

    <i class="fa fa-desktop"></i>
    <span class="fa fa-desktop"></span>
    

That's all :-)

就这样 :-)