Question

我正在使用字体真棒图标，我需要禁用状态图标。有没有办法做到这一点。我也在使用bootstrap。

这就是我使用图标的方式。

<i class="fa fa-slack"><i/>

我只需要图标看起来像灰色。

Answer 1

为已禁用的

编写自定义类

像

这样的东西

C/CMakeLists.txt

添加光标类型对于用户体验非常重要。

Answer 2

你可以定义你的＆＃34; Bootstrap-like＆＃34; disabled类

.fa.disabled,
.fa[disabled],
.disabled > .fa,
[disabled] > .fa {
  color: lightgrey;
  /*or*/ opacity: 0.5;
}

然后像

一样使用它

<i class="fa fa-slack disabled"></i> <!-- or -->
<i class="fa fa-slack" disabled></i> <!-- or -->
<a class="btn btn-primary disabled"><i class="fa fa-slack"></i></a> <!-- or -->
<a class="btn btn-primary" disabled><i class="fa fa-slack"></i></a> <!-- or -->

Answer 3

基本理念只是为其风格着色

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet"/>

<div>Disabled <i class="fa fa-slack" style="color: grey"></i></div>
<div>Enabled <i class="fa fa-slack"></i></div>

Answer 4

您可以降低不透明度并禁用指针事件：

.disabled-button{
      opacity: 0.5;
      pointer-events: none;
 }

Answer 5

$("button[title='Aceptar']").prop("disabled", true);，您可以通过按钮的任何属性（第一个）选择按钮，并禁用更改的属性。

如何创建禁用状态的字体真棒图标？

5 个答案: