/ / Comment changer la couleur des icônes de l'interface sémantique? - css, couleurs, interface utilisateur sémantique

Comment changer la couleur des icônes de l'interface sémantique? - css, couleurs, interface utilisateur sémantique

Je peux faire des icones avec le code

<i class="thumbs up icon large"></i>

Mais comment puis-je changer la couleur du noir au gris? Je le fais pour une extension chrome et j'ajoute le CSS de cette façon dans le manifest.js:

"content_scripts": [
{
"matches": ["http://*/*", "https://*/*"],

"css": [ "tab/layouts/style.css", "app/lib/semantic.min.css" ],
"js": [ "common/owconstants.js", "common/OWprotocol.js", "3rdparty/jquery-1.10.2.min.js", "3rdparty/jquery.mCustomScrollbar.concat.min.js", "3rdparty/jquery-ui-1.10.3.custom.min.js", "common/common.js", "tab/sidebars.js", "tab/communication.js", "tab/syncobject.js", "tab/popup.js", "tab/authorization.js", "tab/userinfo.js", "tab/annotation.js", "tab/usercard.js", "tab/userlist.js", "tab/notifications.js", "tab/friendlist.js", "tab/injection.js", "tab/drops.js", "tab/chat.js", "tab/tracking.js", "tab/keywords.js", "tab/tabscript.js", "app/lib/semantic.min.js"]
}
],

Réponses:

3 pour la réponse № 1

Vous pouvez appliquer:

color: gray; // or any suitable color code, e.g. #808080

à l'une des classes existantes thumbs up icon large le cas échéant, ou ajoutez une nouvelle classe et appliquez-y un style:

HTML

<i class="thumbs up icon large own-class"></i>

Feuille de style

.own-class {
color: gray;
}

6 pour la réponse № 2

Vous pouvez également appliquer: <i class="red users icon"></i> .Pour plus d'informations sur Semantic-Ui, je vous recommande de visiter ce document. http://semantic-ui.com/elements/icon.html#/definition