Bootstrap Font Awesome Social Boutons ne fonctionne pas

J'utilise un modèle pour mon site Web, mais maintenant j'essaie de changer les boutons pour les médias sociaux. Si je spécifie la couleur d'une classe (par exemple btn btn-primary), le bouton change de couleur. Mais seulement avec le btn btn-social btn-twitter il devient transparent. Je suppose que cela est lié au modèle Bootstrap.Bootstrap Font Awesome Social Boutons ne fonctionne pas

Ma question est la suivante: existe-t-il un moyen de forcer la couleur du bouton lors de l'utilisation de l'objet btn btn-social btn-twitter?

Ceci est mon code:

<div class="call-to-action"> 
    <h4 class="mb-5">Mamá Quiero Ser Científica</h4> 
    <ul> 
     <li> 
      <h5>Follow us on our Social Media</h5> 
     </li> 
     <li> 
      <a target="_blank" href="https://twitter.com/mqscientifica" class="btn btn-social btn-twitter waves-effect waves-light" rel="nofollow">Twitter <span class="fa fa-twitter"></span></a> 
     </li> 
     <li> 
      <a target="_blank" href="https://www.facebook.com/Mam%C3%A1-Quiero-Ser-Cient%C3%ADfica-748273108707351/" class="btn btn-block btn-social btn-facebook waves-effect waves-light" rel="nofollow">Facebook <span class="fa fa-facebook"></a> 
     </li> 
     <li> 
      <a target="_blank" href="https://www.instagram.com/mqscientifica/" class="btn btn-block btn-social btn-instagram waves-effect waves-light" rel="nofollow">Instagram <span class="fa fa-instagram"></a> 
     </li> 
    </ul> 
</div>

Voici ce que mes boutons regardent maintenant:

Source

2017-08-21 Marta Lobo

Pourriez-vous expliquer un peu plus ce qu'est le problème et ce que vous essayez d'accomplir? – sol

@ovokuro regardez l'édition que je viens de faire, j'ai posté une image de la façon dont mes boutons regardent maintenant, et ce que je veux, c'est forcer la couleur afin qu'ils soient bleu et rose comme les médias sociaux qu'ils représentent. Merci :) –

Essayez de donner (couleur: bleu;) etc. en CSS. Cela changera en conséquence. –

Essayez de mettre les icônes dans les <i> balises et fournissent la valeur de couleur à la balise <i> dans le CSS. J'espère que cela t'aides. par exemple:

CSS:

`<style> 
    i{ color:red;} 
</style> 

<i class="social fa fa-twitter-square" aria-hidden="true"></i> `

Source

2017-08-21 17:17:17

Merci, mais si la couleur que je veux est celle du bouton social? C'est différent à chaque fois –

L'objet que vous essayez de modifier a plusieurs classes:

class="btn btn-social btn-twitter waves-effect waves-light"

Cela signifie que cet objet est un BTN, un BTN-social, un BTN -twitter etc etc.

Ces classes sont référencées dans la css que vous utilisez (Bootstrap probable ou Material design), donc une solution possible serait de trouver le btn-twitter dans votre css et changez la couleur là.

Bonne chance :)

Source

2017-08-22 09:48:22

Bootstrap Font Awesome Social Boutons ne fonctionne pas

Répondre

Questions connexes