Jak zmienić kolor glifotypu bootstrap?

Question

Chcę zmienić kolor początkowy glifotypu na "żółty", ponieważ bieżący kolor jest wyświetlany na biało, który wygląda jak przycisk Usuń. Jak mogę zmienić kolor glyphicon-folder-close lub użyć dowolnego innego glifotypu, który lepiej wyświetla obraz folderu?

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

Zastosowanie kolor

<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> 

Należy jednak pamiętać, że pożądane jest, aby unikać stosowania stylu inline jest lepsze zajęcia lub odniesienia użytku na podstawie zewnętrznych elementów konfiguracji 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 dla zewnętrznego css

.mybtn-blue { 
    color: blue; 
} 

Answer 2

Aby zmienić kolor, to zrobić:

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

Wystarczy edytować tag rozpiętości w kodzie do tego powyżej, dzięki czemu kod wyglądać tak:

<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 3

Wykorzystanie następujący kod 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> 

I kod css

.yellow { 
    color: #FFCA28; 
} 

oto demo http://jsfiddle.net/S3R23/1217/

Answer 4

Można również zmienić ikonę/tekst poprzez dodanie do klasy „text-sukcesu” na zielono „text-niebezpieczeństwo” dla czerwonych itd Spowoduje to zmianę koloru samej ikony.

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

Odpowiedzi udzielono również tutaj.

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

Answer 5

Można zmienić kolor glyphicon do dowolnej wartości. patrz niżej podanym przykładzie

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

// css

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