标签: font-awesome

我想使用数字列出流程中的步骤.我很好奇如何使用Font Awesome做到这一点.

我想在其中使用带有1,2,3 ......的圆圈.这可能吗？
Will Font Awesome会在图标列表中添加数字吗？

谢谢!

我目前正在使用FontAwesome,并且很难将图标垂直和水平地放在容器中.我试过通过定位来做这件事并遇到问题bc图标大小不同.我基本上有水平,我试图得到垂直.

<div class='container'>
    <div class='row'>
        <div class='offset2 span6 loginContainer'>
            <div class='row'>
                <div class='login-icon'>    
                    <i class='icon-user'></i>
                </div>
                <input type="text"  placeholder="Email" />

            </div>
            <div class='row'>
                <div class='login-icon'><i class=" icon-lock "></i></div>
                <input type="password" class="" placeholder="Password" />
            </div>
        </div>
    </div>
</div>

.login-icon{
    font-size: 40px;
    line-height: 40px;
    background-color:black;
    color:white;
    width: 50px;
    height: 50px;

}
.login-icon [class*='icon-']{
  height: 50px;
  width: 50px;
  display: inline-block;
  text-align: center;
  vertical-align: baseline;
}

http://jsfiddle.net/ncapito/e2UPC/

我的网站上有一个旋转装置,显示的代码如下:

<link rel="stylesheet"
 href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"/>

<i class = "fa fa-cog fa-5x fa-spin"></i>

就个人而言,我认为齿轮的速度太快了.我可以用CSS修改它吗？

在链接/段落和图标之间获得空格的最佳方法是什么？

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<a href="#/upgrade/selection"><i class="fa fa-reply"></i>Change</a>

在文本之前放置一个空格是不行的,因为当你缩小/ uglify项目时它会被更改回来.

我试过各种填充和边距.不能让他们分开.

如果您查看font-awesome的示例,您将看到它们始终使用该i元素.我认为该span元素将是一个更合适的选择,因为该i元素旨在修改"文本范围".,但我想要做的是在页面上放置一个字形,而不是修改现有文本.

您可以认为span元素也用于修改文本范围(因此名称),但W3C定义使其大开 - 只需说明span" 与其他属性一起使用时非常有用 ".

但是,我的问题并不是关注两个标签的语义,而是关注一个标签相对于另一个标签的用户体验含义.在我的测试中,span作品同样如此i.是否有一个优于另一个的具体原因？具体原因的例子包括:

1. 一个元素由可访问性软件(例如,屏幕阅读器)合理地处理,而另一个元素没有.
2. 用户代理支持(例如,一个元素在用户代理之间表现一致,另一个元素不一致).

我可以为css类创建一个别名吗？

我正在使用这个字体很棒,我正在尝试为某些图标类创建一个别名.所以.icon-globe也会调用.globe.

我怎么能完成这样的事情呢？

所以我是网络开发的新手,我正在尝试将字体真棒图标链接到我的社交个人资料,但我不确定如何做到这一点.我尝试使用一个href标签,但它使所有图标将我带到一个网站而不是我想要的网站.这是代码:

 <i class="fa fa-dribbble fa-4x"></i>
 <i class="fa fa-behance-square fa-4x"></i>
 <i class="fa fa-linkedin-square fa-4x"></i>
 <i class="fa fa-twitter-square fa-4x"></i>
 <i class="fa fa-facebook-square fa-4x"></i>

我希望每个图标都可以转到各自的配置文件.有什么建议？

我可以改变fontcolor,但不能改变"填充".我首先尝试设置背景颜色,但填充整个图标框区域.

例如,我有

<i class="icon-star-empty icon-large"></i>

但我希望它是黄色的.

编辑:用例是我想要一个"最喜欢的"图标为灰色轮廓,点击,轮廓变为橙色,填充为黄色.

我构建的应用程序会显示很多图标,所以我需要所有Font-Awesome类名列表, ["fa-dropbox","fa-rocket","fa-globe", ....] 如此有没有办法得到它？

如何在Angular(2+)中使用font-awesome 5？

我试过在组件中添加它:

import {faChevronLeft, faChevronRight} from '@fortawesome/fontawesome-free-solid';
import fontawesome from '@fortawesome/fontawesome';
...
constructor(){
   fontawesome.library.add(faChevronLeft, faChevronRight);
}

然后在HTML中:

<span class="fa" [class.fa-chevron-left]="direction==='left'" [class.fa-chevron-right]="direction==='right'"></span>

但这给了我一个圆圈中闪烁的问号.