Joomla.it Forum
Joomla! 3 => Joomla! 3 => : Alessia77 08 Aug 2017, 16:22:21
-
Ciao a tutti chiedo a voi guru in quanto da sola ho letto mille post ma il risultato non è quello che vorrei.
Ho aggiunto font awesome al template e mi piacerebbe che solo l'icona Fa-check diventi verde ma impostato così anche il testo diventa verde
<p><i class="fa fa-check" style:="green"><span style="font-size: 12pt;">testo</span></p>
Qualche anima pia mi dice come impostare il codice in maniera che solo l'icona fa-check sia verde?
Perdonate l'ignoranza.
-
Ciao, secondo me andrebbe fatto sul foglio di stile (css) e richiamata la regola, comunque prova a "chiudere" l'icona
<i class="fa fa-check" style:="green"></i><span style="font-size: 12pt;">testo</span>
-
è un problema di CSS non di Joomla...
sostituisci style:="green" con style="color:green;" o forse sarebbe meglio il codice esadecimale del verde...
e a questo punto scrivi nello span subito dopo 12pt; color:#000;
-
Hanno già risposto in molti... ;)
Se vuoi usare codice inline come hai fatto tu, questo funziona:
<p><i class="fa fa-check" style="color:green;"></i><span style="font-size: 12pt;">testo</span></p>che altro non è che una semplice correzione di quello che avevi scritto tu.
P.S. Anche se è un po' fuori topic, ma giusto per piccola precisazione, "green" corrisponde all'esadecimale #008000 e all'rgb(0,128,0) e possono essere usati del tutto indifferentemente.
-
Grazie a tutti per le risposte.
Col tuo codice Limma però,utilizzando l editor di default, mi scompare l'icona (magari sbaglio qualcosa)
Invece aggiungendo il codice consigliato da mr.fifteen (avevo trascritto sbagliato e avevo usato già color:green) e aggiungendo il colore nero al testo funziona.
Grazie anche a $red ma il suo consiglio era già un livello troppo alto per me 8)
-
Col tuo codice Limma però,utilizzando l editor di default, mi scompare l'icona (magari sbaglio qualcosa)
...molto bizzarro...
Io uso JCE, ma non credo dia nessun problema con qualunque altro editor.
Se hai un minuto riprova ri-copiando il codice sopra (che ti evita ogni volta di forzare il colore anche sul testo, invece che solo sull'icona).
-
Ok proverò a fare copia incolla :)
-
Giusto per completezza d'informazione (raccogliendo lo spunto di $Red) puoi ottenere lo stesso risultato in maniera più "elegante" utilizzando una classe css.
La classe css, da inserire nel file custom.css (o chi per lui) del tuo template:
.green {
color: green;
}
L'HTML dell'icona:
<i class="fa fa-check green"></i>dove, come vedi, compare la classe "green" che la rende verde.
-
Ecco cosi detta mi è stata più semplice capirla
-
Le classi css ti permettono di sbizzarrirti quasi come ti pare.
Vedi qui (https://disegnareilweb.it/test-page/test-page-1/bootstrap-3-grid) una piccola variazione alla classe di cui sopra.