Modifica colore button bootstrap

[pippuccio76]

Salve a tutti, ho bisogno di modificare (creare uno nuovo) un pulsante di bootrap per cambiare colore :

   .btn-verde {
     color: black;
     background-color: #98FB98;
     border-color: #98FB98;
   }

se inserisco la regola nell'html vedo il pulsante con il colore verde chiaro e la scritta nera , se lo metto in uno dei file css richiamati nell'head non lo vedo , quale potrebbe essere il motivo ?

[KillerWorm]

Ciao, escludendo eventuali errori di validazione del CSS che possono compromettere l'applicazione di tale regola, bisogna verificare se altre regole già presenti vanno a sovrascrivere quella da te inserita, cioè se hanno in qualche modo una maggiore priorità rispetto alla tua.

In tal caso ci sono da considerare alcuni fattori:

- specificità dei selettori, per cui tra più regole che puntano agli stessi elementi ha priorità quella con un valore maggiore di specificità.

- ordine di lettura in cui sono lette/applicate le regole, per cui (a parità di specificità) ha priorità la regole che viene applicata per ultima.

Prova ad ispezionare l'elemento e, nella scheda "Stili", verifica quali proprietà (e relative regole) sono applicate e quali invece risultano barrate (cioè sono sovrascritte da altre proprietà). Verifica i valori di specificità (con i moderni browser puoi vederli attraverso il tooltip che appare passando sui selettori) quindi dove risultano collocate tali regole attraverso il relativo link a destra di ciascuna regola.

Se necessario, modifica il selettore della tua regola per ottenere una maggiore specificità e/o sposta la regola in modo che sia letta per ultima rispetto alle altre che puntano agli stessi elementi.

Se hai bisogno di maggiori informazioni sugli argomenti in questione ti invito a dare uno sguardo tra i link utili CSS, al capitolo 2, sotto la voce "-- Specificità, ereditarietà, override --".

[SoloWiFi]

! important

[pippuccio76]

! important

Volevo evitare di usarlo, non è una best practice se non sbaglio