Con questa guida impareremo a realizzare una tabella simile a questa:

All'interno di essa possiamo inserire Testo, Immagini etc..


Andiamo ora ad Analizzare il codice:


width: DIMENSIONI DELLA TABELLA%: Al posto di "DIMENSIONI DELLA TABELLA" Regoliamo le dimensioni.

background-color: #COLORE DELLO SFONDO;: Al posto di "COLORE DELLO SFONDO" inseiramo il codice esadecimale che vogliamo come sfondo della tabella.

border: SPESSORE BORDOpx solid: Al posto di "SPESSORE BORDO" mettiamo il numero di pixel che vogliamo come spessore del bordo intorno alla tabella.

#COLORE DEL BORDO";: Al posto di "COLORE DEL BORDO" mettiamo il codice esadecimale del colore che vogliamo per il bordo intorno alla tabella.

N.B. Dopo aver inserito tutto all'interno della tabella mettiamo il codice

in fondo a tutto per chiudere la tabella.

Non capisco perché tu prima abbia dichiarato un 'div' che specifica la posizione del contenuto, poi creato una tabella con una sola colonna e riga; quest'effetto si può ottenere anche senza utilizzare le tabelle, dal momento che ha una sola cella:

Testo/immagini/oggetti all'interno

HTML <div style="border: SPESSORE px solid rgb(ROSSO1, VERDE1, BLU1); padding: DISTANZA px ; background-color: rgb(ROSSO2, VERDE2, BLU2);">Testo/immagini/oggetti all'interno</div>

SPESSORE: lo spessore del bordo in pixel

ROSSO1, VERDE1, BLU1: la quantità di rosso, verde e blu del colore del bordo (non tutti conoscono il codice esadecimale...)

DISTANZA : La distanza del contenuto dai bordi in pixel.

ROSSO2, VERDE2, BLU2: la quantità di rosso, verde e blu del colore di sfondo

Testo/immagini/oggetti all'interno: inserisci qui il contenuto