[HTML] Aggiungere un'immagine di sfondo della pagina web in HTML
Per aggiungere un'immagine allo sfondo della pagina web in html, abbiamo bisogno di un hosting che ci permetta di caricare foto. In rete ne esistono svariati e gratuiti tra cui Flickr, Photobucket, Imageshake, e tanti altri ancora. Per accedere basta registrarsi al servizio, creare un account e iniziare a caricare le foto che si desiderano. Se possedete un blog è possibile che il servizio comprenda la creazione di album fotografici e non rimane altro, in questo caso, che caricarle sull'album del blog. Per esempio Blogger mette a disposizione Picasa disponibile in automatico alla creazione del blog.
Carichiamo l'immagine che si desidera mettere come sfondo della pagina web, prendiamo l'url dell'immagine e mettiamolo all'interno del tag body background:
<body background="URL dell'immagine di sfondo.jpg">
Per esempio, se vogliamo che l'immagine di sfondo sia questa (cliccare sull'immagine per ingrandirla e prendere l'url):
carichiamola sul nostro blog, o Flickr, o Photobucket, prendiamo l'url e inseriamolo all'interno del tag:
<body background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyp5xV_2pngY5YWIpLBjl8MazkJcYljcDfg_4IsXx-N5he77UxOYK_S0Tfu_U1EHK1OvXQrL1HISWeuKSmMmeyb7XkW310pHjFH_VRt_0xBha32SbVgrNRRVeMBQT31Z91r-DEM7ZXT_I/s1600/immagine+di+sfondo+html+portale+tecnologico.jpg">
Tornando alla prima pagina web creata qua, posizioniamo la stringa del tag che contiene l'url dell'immagine di sfondo all'interno del tag body e il risultato sul foglio di stile sarà questo (ho evidenziato in rosso la stringa dell'url dell'immagine di sfondo):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>webtools</title>
</head>
<body>
<body bgcolor="#ff0000">
<body background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyp5xV_2pngY5YWIpLBjl8MazkJcYljcDfg_4IsXx-N5he77UxOYK_S0Tfu_U1EHK1OvXQrL1HISWeuKSmMmeyb7XkW310pHjFH_VRt_0xBha32SbVgrNRRVeMBQT31Z91r-DEM7ZXT_I/s1600/immagine+di+sfondo+html+portale+tecnologico.jpg">
<Br><Br><Br>
<P align="center">Il mio sito</P>
<P align="center">Consigli telematici</P>
</Br>
</body>
</html>
Sulla pagina web, questa la visualizzazione (cliccare sull'immagine per ingrandire):
0 commenti:
Posta un commento