Impostare il bordo ai singoli caratteri di un testo


A volte, colorare le singole lettere di una parola non è sufficiente per metterla in rilievo rispetto al testo normale, quindi potrebbe essere utile aggiungere un bordo. Non serve utilizzare programmi di fotoritocco quando tale testo è contenuto in un sito, un blog o una qualsiasi pagina web dove viene accettato l'HTML, basta semplicemente utilizzare il css.

Qui di seguito è riportata una parola colorata di rosso, a cui è stata aggiunto il css per aggiungere il bordo.

ESEMPIO:
SCUOLISSIMA --> SCUOLISSIMA


Per ottenere questo risultato ho utilizzato il seguente codice:
<span style="text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;"> SOSTITUISCI PAROLA </span>


Metodo alternativo

Se al posto dello span state utilizzando un div, si procede diversamente:
<div class="bordoparola">SOSTITUISCI PAROLA</div>

e poi si deve aggiungere in una sezione dedicata al css, il seguente codice:
#bordoparola {text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;}

Quest'ultimo codice lo si può aggiungere anche dentro la pagina web stessa purché venga racchiuso fra i seguenti tag:
<style> #bordoparola {text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;} </style>

Tramite questa breve guida avete appena appreso come inserire un semplice bordo a un testo.



Nessun commento :

Scrivi un commento

I commenti dovranno prima essere approvati da un amministratore. Verranno pubblicati solo quelli utili a tutti e attinenti al contenuto della pagina. Per commentare utilizzate un account Google/Gmail, altrimenti la modalità "anonimo".