Come qualcuno avrà magari notato, ho fatto dei cambiamenti al mio sito, in particolare, ho rifatto ultimamente la mia home page utilizzando uno sfondo da me realizzato fondendo più immagini, ma soprattutto mi son realizzato un sito in fullscreen.
Questo sarebbe meglio visualizzabile se non fosse che di base ho deciso di utilizzare Joomla (dove è possibile visualizzare un background che cambia in sequenza, grazie al tema di phoca.cz), ma non voglio dilungarmi troppo, quindi verrò subito alla spiegazione di come potete realizzare anche voi un sito con un’immagine di sfondo che si auto-ridimensiona con la vostra finestra del browser.
Prima di tutto dovete creare nel vostro file css o nelle regole inserite all’interno della vostra home page, una div come di seguito:

#sfondo {
position:absolute;
width:100%;
height:100%;
margin:0px;
padding:0px;
left:0px;
right:0px;
z-index:1
}

Dovrete ben specificare lo “z-index:1” per far capire che questa div dovrà essere quella meno in rilievo.

Nella vostra pagina poi, andrete a impostare la vostra immagine all’interno della div “sfondo” come da esempio:

</head>
<body>
<div id="sfondo">
<img src="background.jpg" width="100%" height="100%">
</div>
qui le restanti div o il resto della pagina
</body>
</html>

[ratings]

Pubblicato da Francesco

Sistemista con la passione per il Web Design e per la tecnologia, sempre al passo con i tempi, cerco le soluzioni a svariati problemi che riguardano i pc, server o web in generale. Cerco di essere sempre aggiornato, creo siti e cerco ispirazioni per migliorare sempre più le loro grafiche.

Lascia un commento