[HTML] immagine di sfondo delle celle

[HTML] immagine di sfondo delle celle

  luglio 17, 2014    portaletecnologico

---

E' possibile modificare lo sfondo di una o più celle, oltre che cambiare il colore dello sfondo, inserendo un'immagine. L'attributo che useremo è background e lo inseriremo all'interno del tag <td>. L'immagine deve essere caricata su un host immagini (Flickr, Picasa, Photobucket, etc) dal quale prenderemo l'url dell'immagine stessa:

<table width="300" height="200" border="2">  
<tr>
<td background="URL DELL'IMMAGINE.JPG">contenuto 1</td>
<td>contenuto 2</td>
</tr>
<tr>
<td>contenuto 3</td>
<td>contenuto 4</td>
</tr>
</table>


Supponiamo di voler inserire questa immagine come sfondo per tutte e quattro le celle:

Avremo (in rosso l'url dell'mmagine):

<table width="300" height="200" border="2">  
<tr>
<td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmg00dqt2JQTftfvCobJzPHjrFRjk8FPbYn5Ua8FS72M6KFM80jxxnFANWzyyVfSisTwhl_K_OGfPo55ZNPIb19UN2lRjufWTSjIsPVq4Jsk9RKIcsKWec4o4EtSKym2w9VeDse0n-9ms/s1600/Immagine+di+sfondo+delle+celle.jpg">contenuto 1</td>

<td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmg00dqt2JQTftfvCobJzPHjrFRjk8FPbYn5Ua8FS72M6KFM80jxxnFANWzyyVfSisTwhl_K_OGfPo55ZNPIb19UN2lRjufWTSjIsPVq4Jsk9RKIcsKWec4o4EtSKym2w9VeDse0n-9ms/s1600/Immagine+di+sfondo+delle+celle.jpg">contenuto 2</td>
</tr>
<tr>
<td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmg00dqt2JQTftfvCobJzPHjrFRjk8FPbYn5Ua8FS72M6KFM80jxxnFANWzyyVfSisTwhl_K_OGfPo55ZNPIb19UN2lRjufWTSjIsPVq4Jsk9RKIcsKWec4o4EtSKym2w9VeDse0n-9ms/s1600/Immagine+di+sfondo+delle+celle.jpg">contenuto 3</td>
<td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmg00dqt2JQTftfvCobJzPHjrFRjk8FPbYn5Ua8FS72M6KFM80jxxnFANWzyyVfSisTwhl_K_OGfPo55ZNPIb19UN2lRjufWTSjIsPVq4Jsk9RKIcsKWec4o4EtSKym2w9VeDse0n-9ms/s1600/Immagine+di+sfondo+delle+celle.jpg">contenuto 4</td>
</tr>
</table>

contenuto 1	contenuto 2
contenuto 3	contenuto 4

Oppure possiamo usare più combinazioni, la prima riga con un'immagine, la seconda con un'altra o inserire una diversa immagine di sfondo per ogni singola cella:

<table width="300" height="200" border="2">  
<tr>
<td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmg00dqt2JQTftfvCobJzPHjrFRjk8FPbYn5Ua8FS72M6KFM80jxxnFANWzyyVfSisTwhl_K_OGfPo55ZNPIb19UN2lRjufWTSjIsPVq4Jsk9RKIcsKWec4o4EtSKym2w9VeDse0n-9ms/s1600/Immagine+di+sfondo+delle+celle.jpg">contenuto 1</td>

<td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmg00dqt2JQTftfvCobJzPHjrFRjk8FPbYn5Ua8FS72M6KFM80jxxnFANWzyyVfSisTwhl_K_OGfPo55ZNPIb19UN2lRjufWTSjIsPVq4Jsk9RKIcsKWec4o4EtSKym2w9VeDse0n-9ms/s1600/Immagine+di+sfondo+delle+celle.jpg">contenuto 2</td>
</tr>
<tr>
<td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdY801ELI8MBxxiUWMi9z5cvRqaagnBVppZicgFuK0dkQY-YxEsAGYQHcDmtJ3OqTdjGnJ4Ut2tht7QApgOm01roeGBWB04I8WmJZ7CQrv_SF9O3jieZEpcEhT-sm0cfc-u-npRIF2Qt8/s1600/immagine+di+sfondo+delle+celle+2.jpg">contenuto 3</td>
<td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdY801ELI8MBxxiUWMi9z5cvRqaagnBVppZicgFuK0dkQY-YxEsAGYQHcDmtJ3OqTdjGnJ4Ut2tht7QApgOm01roeGBWB04I8WmJZ7CQrv_SF9O3jieZEpcEhT-sm0cfc-u-npRIF2Qt8/s1600/immagine+di+sfondo+delle+celle+2.jpg">contenuto 4</td>
</tr>
</table>

contenuto 1	contenuto 2
contenuto 3	contenuto 4