Printable View
Buona sera.
Ho gia' creato un sito, ma ho un problema e cioe': alcune pagine hanno come sfondo una foto, ma anziche' apparire completa e una sola volta, mi appare piu' la foto piu' volte, magari la foto completa e sotto un pezzo della stessa foto.
Quindi chiedo: che dimensione deve avere la foto di partenza per apparire intera ed una sola volta?
Grazie.
Non c'è una dimensione fissa perché dipende dalla risoluzione dello schermo; ad esempio se la foto è di larghezza 1024px, la vedrò bene io che ho la risoluzione 1024x768, ma la vedrà ripetuta un altro tizio che ha la risoluzione a 1600x1200.
Grazie.
Se non vuoi che si ripeta comunque usa l'attributo css:
quel che non puoi fare però è far sì che la foto si veda sempre per estesa; le immagini di sfondo vengono sempre visualizzate alla loro dimensione originale.Codice:background-repeat: no-repeat;
dai un'occhiata a questo post.
Quello che chiedi si può fare ma non ricordo esattamente come. Fai una ricerca nel forum se non sbaglio è un'argomento già trattato.
Edit:
Questo è vero però puoi almeno tentare di far centrare l'immagine nella pagina e di evitare il repeat.Citazione:
quel che non puoi fare però è far sì che la foto si veda sempre per estesa; le immagini di sfondo vengono sempre visualizzate alla loro dimensione originale.
Sì basta mettere:Citazione:
Originalmente inviato da vivalataverna
Il problema qui era per l'appunto il visualizzare lo sfondo esteso, il che è impossibile.Codice:background: no-repeat center center;
Non penso sia impossibile... alla fine basterebbe conoscere la risoluzione dello schermo del visitatore...
Ciao
Mmmmmhh con Javascript sì giusto, non ci avevo pensato; con JS (DHTML) si può tranquillamente fare :tongue
Ho trovato questo,
body {
background-image: url della foto
background-repeat: no-repeat;
}
ma non riesco ad applicarlo!
devi metterlo o fra i tag <style> e </style> all'interno dei tags head, oppure nel foglio di stile esterno.
E cmq per background-image la sintassi è:
Codice:background-image: url('URL_IMMAGINE');
Non riesco.
Indicatemi per favore come deve essere scritto questo tag, magari metterndo anche un URL.
Grazie.
Un esempio di codice è il seguente, da scrivere tra i tag <head> e </head>Citazione:
Originalmente inviato da luca1962
<style type="text/css"> body { background:url ('images/nome.jpg') center 50px no-repeat #ccc; } </style>
Center significa centrato orizzontalmente su tutte le risoluzioni
Poi, 50px significa 50 px dal bordo superiore dello schermo
#ccc significa il colore da scegliere per il resto dello sfondo
"images/nome.jpg" è la posizione e il nome della tua immagine...
.
Adesso l'ho fatto.
Ho messo nella stessa cartella la foto e la pagina e me la apre in modo corretto.
Pero' quando vado a caricarla sul web, non visualizza la foto, cioe' l'immagine di fondo ma solo la scritta col link ad un'altra pagina.
I tag che ho inserito sono:
<HTML>
<HEAD>
<body style="background-image: url(La Natura.jpg); background-repeat:no-repeat;"></body>
</HEAD>
</HTML>
Sto impazzendo!
posta il link alla pagina pubblicata in cui ti dà il problema.
EDIT:
I server linux (su cui è hostato il tuo sito) fanno differenza tra maiuscole e minuscole e non interpretano nomi di file contenenti spazi. O rinomini il file togliendo lo spazio o tieni il file con lo spazio e nel link scrivi %20 al posto dello spazio (La%20Natura.jpg)Citazione:
<body style="background-image: url(La Natura.jpg); background-repeat:no-repeat;"></body>
E' la home page, dove anziche' vedere l'immagine di sfondo e la scritta in basso a destra, visualizza solo la scritta.
http://www.luca1962.altervista.org/
sei sicuro di aver caricato l'immagine nella stessa cartella?
Se si mi posti il nome esatto del file? (facendo attenzione a maiuscole e minuscole)
Sono riuscito perche' ho avuto un lampo di genio: dovevo caricare anche la foto in quanto tale!
Scrivere: url(La Natura.jpg); è un errore, bisogna scrivere url(La_Natura.jpg); , poi rinominare l'immagine in La_Natura.jpg e uploadare entrambi sul server nella versione corretta. La differenza sta nel underscore, trattino basso.
non vorrei rovinarti la serata, ma con firefox non si vede lo sfondo (con ie 7 si).
Prova a sostituire lo spazio nel nome con il carattere _ (underscore) e poi aggirna il codice
con:Codice:<body style="background-image: url(La Natura.jpg); background-repeat:no-repeat;"></body>
Codice:<body style="background-image: url(La_Natura.jpg); background-repeat:no-repeat;"></body>
Hai messo il body nell'head e il contenuto della pagina fuori dal body, è tutto al contrario di come dovrebbe essere -,-
Azz, non me ne ero accorto.Citazione:
Originalmente inviato da Zorinik
@luca1962
rinomina il file in La_Natura.jpg e edita il file index cancellando tutto quello che c'è e sostituiscilo con:
Codice:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>metti il titolo pagina</title>
</HEAD>
<body style="background-image: url(La_Natura.jpg); background-repeat:no-repeat;">
<a href="sfondoblue.html">
<FONT SIZE=5>
<FONT COLOR="#FFFF00">
<div style="margin-left:950px; margin-top:500px">
Introduzione
</div></FONT></a>
</body>
</HTML>
luca1962, utilizzare nomi per i tuoi file con lettere tutte minuscole, senza spazi (usa gli underscore), ti aiuterà sempre ad evitare problemi del genere "risorsa non trovata" :wink:
Non capisco: mi visualizza tutte le foto delle pagine tranne la foto della home page e di Giardinaggio!
www.luca1962.altervista.org
E ho caricato sia le pagine che le relative fotografie!
Che faccio?
Grazie.
L'estensione dei due file è scrtta in maiuscolo mentre nei link è scritta in minuscolo.
Devi rinominare il file e cambiare l'estensione da .JPG a .jpg.
Mi son dimenticato di dirti che vale anche per le estensioni dei file.Citazione:
I server linux (su cui è hostato il tuo sito) fanno differenza tra maiuscole e minuscole e non interpretano nomi di file contenenti spazi.
Comunque la sintassi che usi nelle pagine è sbagliata. devi ordinare i tag <head> <body> e <html> in questo ordine:
Codice:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>metti il titolo pagina</title>
</HEAD>
<body style="background-image: url(la_natura.jpg); background-repeat:no-repeat;">
<a href="sfondoblue.html">
<FONT SIZE=5>
<FONT COLOR="#FFFF00">
<div style="margin-left:950px; margin-top:500px">
Introduzione
</div></FONT></a>
</body>
</HTML>
Finalmente ce l'ho fatta.
Ancora qualche piccolo ritocco e poi sara' definitivo.
Grazie a chi di voi mi ha seguito ed aiutato!