Inserire un blocco di testo in un rettangolo colorato con l'HTML.

In questo articolo ho dato dei consigli su come inserire un blocco di testo in un rettangolo sfruttando la funzionalità della Tabella in Windows Live Writer o, in subordine digitando il codice HTML direttamente. Mentre in quest'altro articolo ho parlato della rappresentazione dei colori "true colours" in esadecimali e come utilizzarla. Adesso cerchiamo di unire queste due conoscenze cercando di creare un riquadro all'esterno di un blocco di testo che si vuole evidenziare.

Se si ha WLW si inserisce la tabella con una sola riga ed una sola colonna quindi si passa alla visione HTML. Se invece non si ha si può scrivere in modalità HTML questo codice

<table width="542" align="center" bgcolor="#00ff00" border="0"><tbody>
<tr>
<td width="540" bgcolor="#ffffff">Inserimento del testo del riquadro</td>
</tr>
</tbody></table>

Dove i valori scritti in rosso possono essere modificati

• 542 è la larghezza del riquadro
• center è l'allineamento al centro ma possiamo mettere anche "left", "right", "justify" per sinistra, destra giustificato.
• 540 è la larghezza in pixel che si vuole utilizzare per scrivere il testo, ovviamente questo valore deve essere uguale o inferiore al primo



• bgcolor attributo di table è il colore del riquadro, si può impostare come abbiamo visto in questo post che ho già citato
• bgcolor attributo di td è il colore di sfondo del riquadro e può essere scelto come sopra
• In Inserimento del testo del riquadro si scrive quello che si vuole inserire all'interno

A titolo di esempio ho inserito nel codice precedente i seguenti attributi

<table width="600" align="center" bgcolor="#00ff00" border="0"><tbody>
<tr>
<td width="600" bgcolor="#ffff00">INSERIMENTO DEL TESTO</td>
</tr>
</tbody></table>

I colori sono il verde ed il giallo, decisamente brutti ma semplici, per far capire come fare questa operazione. Ecco il risultato finale

QUESTI TIPI DI RIQUADRI POSSONO ESSERE INSERITI IN ALCUNI POST NEI QUALI SI VUOLE PORRE PARTICOLARE ATTENZIONE SU UNA COSA SPECIFICA. POSSONO' ANCHE ESSERE ASSOCIATI AD UN LINK BASTA METTERE PRIMA DEL CODICE DEL RIQUADRO <a href="indirizzo del collegamento> E </a> ALLA FINE. IN QUESTO CASO HO MESSO UN COLLEGAMENTO AD UN ALTRO MIO BLOG DI VIDEO DAL TITOLO PHOTOS AND VIDEOS. IL TESTO PUO' ESSERE MODIFICATO ANCHE DOPO CHE SI E' INSERITO IL RIQUADRO E AUTOMATICAMENTE LE SUE DIMENSIONI IN ALTEZZA SI ADATTERANNO ALLA LUNGHEZZA DEL TESTO. NON PREOCCUPATEVI TROPPO DELLE DIMENSIONI PERCHE' CON IL MOUSE POSSONO ESSERE VARIATE COME E QUANDO SI VUOLE ANCHE IN UN SECONDO TEMPO.