Ciao a tutti!
Appena iscritto e decisamente acerbo nel mondo dell'html, sono a chiedere il vostro aiuto per un paio di problemi che ho nel realizzare una splash page di un sito.
La pagina è composta semplicemente da un'immagine (welcome.png, perfettamente circolare) che è posizionata al centro della pagina. Lo sfondo (sfondo.png) è dato anch'esso da un'immagine che si ripete per la lunghezza. La pagina deve essere scalabile, e il cerchio non deve deformarsi alla variazione delle dimensioni del browser.
Sono riuscito a rendere l'immagine scalabile, modificando le dimensioni del browser essa si adatta e non si deforma. I problemi che ho sono:
- non riesco in nessun modo a posizionare l'immagine al centro, ma mi resta ancorata in cima e al lato sinistro
- non riesco a rendere scalabile lo sfondo, ad esempio riducendo il browser l'immagine circolare rimpicciolisce e non si deforma, mentre lo sfondo "scompare" perchè resta fisso nella sua posizione
Questo è il codice che sto utilizzando:
codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>nuovo documento</title>
<style type="text/css">
.welcome {
width: auto;
height: 100%;
position: absolute;
padding: 0px;
z-index: -1;
top: 0%;
left: 0%;
}
body {
background-color: #000;
background-image: url(sfondo.png);
background-repeat: repeat-x;
}
</style>
</head>
<body>
[img]welcome.png[/img]
</body>
</html>
Help!