Измените цвет глификонов на синий в некоторых, но не на всех местах, используя Bootstrap 2

Я использую структуру Bootstrap для своего пользовательского интерфейса. Я хочу изменить цвет моих глификонов на синий, но не во всех местах. В некоторых местах он должен использовать цвет по умолчанию.

Я упомянул эти две ссылки, но я не нахожу ничего полезного.

  • Могу ли я добавлять цвета к значкам начальной загрузки только с помощью CSS?
  • Как изменить глификоны Bootstrap 3 на белый?

Обратите внимание: я использую Bootstrap 2.3.2 .

Значок примет цвет от значения свойства color css его родителя.

Вы можете добавить это непосредственно в стиль:

  

Или вы можете добавить его как class в свой значок, а затем установить цвет шрифта в CSS

HTML

    

CSS

 .blue { color: blue; } 

Пример этой скрипки .

просто примените class загрузки-загрузки Bootstrap 3 на иконке:

 начал работу 

введите описание изображения здесь

Существует больше цветов: Bootstrap Documentation: Вспомогательные classы
(Синий также присутствует)

Наконец я нашел ответ сам. Чтобы добавить новые значки в загрузочный файл 2.3.2, мы должны добавить Font Awsome css в ваш файл. После этого мы можем переопределить стили css, чтобы изменить цвет и размер.

  

CSS

 .brown{color:#9b846b} 

Если мы хотим изменить цвет значка, просто добавьте коричневый class, и значок станет коричневым. Он также предоставляет иконку различного размера.

HTML

 

icon-camera-retro

icon-camera-retro

icon-camera-retro

icon-camera-retro

Для bootstrap 3.0 это сработало для меня:

 .myclass .glyphicon {color:blue !important;} 

Вы можете сделать это, надеюсь, поможет

  

Да, вы можете установить значки на белый цвет. вот как это сработало для меня.

Bootstrap <3

HTML

  

Это сделает ваш значок белым.

Я создал альтернативную библиотеку цветов для bootstrap 2.3.2, она доступна и проста в использовании для всех, кто интересуется большим количеством цветов для старой библиотеки глификонов.

Если это только значок начальной загрузки. Обратите внимание, что значки находятся под текстом или, скорее, типографикой. Просто добавьте class цвета текста, как это. Например, текстовое, текстовое и т. Д. И т. Д. В class значков:

   

Bootstrap> = v4.0 сбросил поддержку глификона

Выбросил шрифт значка Glyphicons. Если вам нужны значки, некоторые параметры:

восходящая версия Glyphicons

Octicons

Шрифт Awesome

Источник: https://v4-alpha.getbootstrap.com/migration/#components

Если вы используете Bootstrap> = v4.0 или новее, вы можете использовать существующие classы стиля бутстрапа, такие как text-success , text-warning и т. Д.

Например, если вы используете fontawesome:

  

CSS:

 .blue-icon{ color:blue !important; } 

HTML

  

Глификоны удалены в 4.0, я рекомендую Font-awesome 4 или новее 🙂

Все предыдущие ответы верны, но вот простой и быстрый способ, если вам нужно только один значок в одном месте, чтобы изменить его цвет:

  

Time icon:

введите описание изображения здесь