Ridimensionare e posizionare immagine di sfondo

**Il Pazzo** · 02-11-2007, 12:34

Ho cercato ma non ho trovato nulla...
Ho creato un immagine e la devo posizionae come sfondo a schermo intero... non deve essere ripetuta... sono sorti due problemi:

1 - Quando cambio risoluzione, immagine imane la stessa... non si ridimensiona.. quindi nel caso aumenti la risoluzione mi rimane uno spazio bianco in basso a destra... nel caso la diminuisca l'immagine viene tagliata....

2 - Nel caso di firefox se non ho schede aperte l'immagine si vede perfettamente, altrimenti viene tagialata in basso... se proprio deve essere tagliata peferirei venisse tagliata in alto (ma forse questo problema si risolve automaticamente con il primo... nel dubbio lo espongo)

Il codice che ho fatto è questo (non uccidetemi se fa tanto schifo.. una settimana fa ho sentito palare per la prima volta di css e oggi ho iniziato)

codice:

<HTML>
    <BODY>
        <style type="text/css">
            BODY{
                background: url("Sfondo.jpg");
                padding: 0px;
                background-position: bottom bottom;
                background-repeat: no-repeat;
            }
            &lt;/style&gt;
        </style>
    </BODY>
</HTML>

Non va... non capisco neanche il perchè...

**fcaldera** · 02-11-2007, 12:41

ci sono diversi errori

codice:

...

<head>
  <style type="text/css">
     body {
         background: url("Sfondo.jpg") bottom bottom no-repeat;
         padding: 0px;
    }       
  </style>
...
</head>

<body>
contenuto
</body>
</html>

Lo sfondo sarà visibile in base a quanti contenuti inserirai. Il body non si dimensiona in base allo sfondo che ci metti.

ti suggerisco però di leggere una delle guide presenti in questo sito relative ai css ma anche all'(X)HTML.

**Il Pazzo** · 02-11-2007, 13:00

ok ti ringrazio...

si le sto leggendo.. ma alcune parti non le capisco ...
viene detto che la dichiarazione va fatta nell'HEAD... ma quel codice che avevo scritto e che hai scritto anche tu mi semba più di una dichiarazione a me....

e poi non capisco... va beh.. ho messo questa dichiarazione nell'head... ma non riesco ad utilizzarla.... mi pare solo di aver capito che il mio è un css interno...

**Il Pazzo** · 02-11-2007, 13:29

Fose ho capito come funzionano.... con quel codice li indico che tutto quello che sarà scritto dentro il tag BODY deve avere quelle caratteristiche... allora perchè a me non funziona???

mi spunta solo la pagina bianca con quella scritta...

la guida dice:

E veniamo alla proprietà background. Con essa, ricordiamolo, possiamo definire in un colpo solo tutti gli aspetti dello sfondo. Per essere valida, la dichiarazione non deve contenere necessariamente riferimenti a tutte le proprietà viste finora, ma deve contenere almeno la definizione del colore di sfondo.

Quindi ho corretto così

codice:

<HTML>
    <HEAD>
        <style type="text/css">
	    BODY {
	        background: white url("Sfondo.jpg") bottom bottom no-repeat;
		padding: 0px;
            }
        </style>
    </HEAD>

    <BODY>
		ciao animali
    </BODY>
</HTML>

Ho provato a levare le " " dall'url come nell'esempio della guida ma non funziona lo stesso..

PS.: L'empio della guida è il seguente

codice:

body {
background: white url(sfondo.gif) repeat-x fixed;
}

**H5N1_Aviaria** · 02-11-2007, 13:42

Ma l'immagine "sfondo.gif" si trova nella stessa directory della pagina?

**Il Pazzo** · 02-11-2007, 13:45

Originariamente inviato da H5N1_Aviaria
Ma l'immagine "sfondo.gif" si trova nella stessa directory della pagina?

si.....

se tu vedi nel primo post avevo fatto una cosa assurda... in quel modo l'immagine la prendeva ma non funzionava niente.... ora invece neanche l'immagine si vede... non riesco proprio a capire...

**H5N1_Aviaria** · 02-11-2007, 13:55

codice:

body{
background : url('sfondo.gif') 100% 100% fixed no-repeat
}

Una noticina: le immagini di sfondo non si possono ridimensionare, ma solo spostare.

**Il Pazzo** · 02-11-2007, 13:58

Originariamente inviato da H5N1_Aviaria

codice:

body{
background : url('sfondo.gif') 100% 100% fixed no-repeat
}

Una noticina: le immagini di sfondo non si possono ridimensionare, ma solo spostare.

non funziona

**H5N1_Aviaria** · 02-11-2007, 14:02

fammi vedere il codice dell'intera pagina.

**Il Pazzo** · 02-11-2007, 14:06

Originariamente inviato da H5N1_Aviaria
fammi vedere il codice dell'intera pagina.

codice:

<HTML>
    <HEAD>
        <style type="text/css">
	    BODY {
	        background : url('sfondo.jpg') 100% 100% fixed no-repeat;
		padding: 0px;
            }

        </style>
    </HEAD>

    <BODY>
	ciao a tutti
    </BODY>
</HTML>

ho provato a mettere anche il white davanti all'url sempe facendo riferimento a quello che diceva la guida... il fatto strano è che se scrivo il codice dentro il body invece che dentro l'head funziona!

PS.: Vedi che l'immagine è jpg... quella gif era dell'esempio riportato nella guida...

Discussione: Ridimensionare e posizionare immagine di sfondo

Strumenti discussione

Ricerca discussione

Visualizza

Ridimensionare e posizionare immagine di sfondo

Permessi di invio