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.