Question

我想将bootstrap glyphicon颜色改为＆＃34; yellow＆＃34;因为当前颜色显示为白色，看起来像删除按钮。如何更改glyphicon-folder-close的颜色或使用更好地显示文件夹图像的任何其他字形？

main.html中

<button type="button" class="btn btn-info btn-lg" ng-click="serverFiles()" style="margin-left: 10px"><span class="glyphicon glyphicon-folder-close"></span></button>

Answer 1

您还可以通过添加“text-success”类为绿色，“text-danger”为红色等来更改图标/文本。这将更改图标本身的颜色。

<span class="glyphicon glyphicon-usd text-success"></span>

此处也有人回答。

Change the color of glyphicons to blue in some- but not at all places using Bootstrap 2

Answer 2

使用颜色

 <button type="button" 
      class="btn btn-info btn-lg" ng-click="serverFiles()"
      style="margin-left: 10px; color:#FF0000;">
          <span class="glyphicon glyphicon-folder-close"></span></button>

但请记住，最好避免使用内联样式，更好地使用基于外部css配置项的类或引用

 <button type="button" 
      class="btn btn-info btn-lg mybtn-blue" ng-click="serverFiles()"
      style="margin-left: 10px;">
          <span class="glyphicon glyphicon-folder-close"></span></button>

edn for external css

.mybtn-blue {
   color: blue;
}

Answer 3

使用以下HTML代码

<button type="button" class="btn btn-info btn-lg" ng-click="serverFiles()" style="margin-left: 10px"><span class="glyphicon glyphicon-folder-close yellow"></span></button>

和css代码

.yellow {
    color: #FFCA28;
}

这是演示http://jsfiddle.net/S3R23/1217/

Answer 4

您可以通过直接指定颜色名称来更改图标的颜色，但这仅适用于目标图标。

<a href="#" class="glyphicon glyphicon-exclamation-sign"  style="color: red; font-size: 20px"></a>

Answer 5

要更改颜色，请执行以下操作：

<span class="glyphicon glyphicon-folder-close" style="color:#ffff00"></span>

只需将代码中的span标记编辑为上面的标记，使代码如下所示：

<button type="button" class="btn btn-info btn-lg" ng-click="serverFiles()" style="margin-left: 10px"><span class="glyphicon glyphicon-folder-close" style="color:#ffff00"></span></button>

Answer 6

您可以将glyphicon颜色更改为任何值。见下面给出的例子

<span aria-hidden="true" class="glyphicon form-control-feedback glyphicon-ok"></span>

// CSS

 .glyphicon.form-control-feedback.glyphicon-ok{
  color: #20032d !important;  
}

如何改变bootstrap glyphicon的颜色？

6 个答案: