Immagine di sfondo pagina deformata nel responsive 
Author: Beate E.Buona sera;
volevo trasformare in web-responsive il sito www.parcoculturaledicamaiano.it
Il grosso problema è l'immagine di sfondo del contenuto della homepage: purtroppo nelle risoluzioni sotto ai 720 pixel l'immagine si deforma e rende inapplicabile il modello responsive.
Ho pensato a 3 soluzioni che forse/probabilmente sono irrealizzabili:
1) ho cercato di spostare i breakpoint per mantenere la visualizzazione per tablet anche sui dispositivi più piccoli, ma mi pare che non si possa fare (eccetto che per il breakpoint più piccolo e quello non mi cambia niente)
2) ho guardato se ci fosse la possibilità di creare una homepage differente per le risoluzioni più basse, ma non mi sembra che si possa fare... o sì?
3) ho cercato di vedere se esiste un modo (semplice) per inserire un'immagine interattiva che possa sostituire la soluzione attuale ma non so se è fattibile.
C'è qualche soluzione alla quale non sono arrivata? Si può fare in modo che gli sfondi delle pagine si rimpiccoliscano invece di deformarsi? Questa deformazione mi sembra una brutta cosa comunque....
allego lo screenshot dell'immagine deformata
Grazie, Beate
prova con questo:
proprietà pagina-esperto-prima della chiusura del tag boady:
<div><img src="files/immagine.jpg" id="sfondo" alt="" /></div>
proprietà pagina-esperto-prima della chiusura del tag Head:
<style>
#sfondo{
position:absolute;
top:0;
left:0;
z-index:-2;
width:100%;
height:100%;
}
</style>
Inserire in files l'immagine relativa allo sfondo.
forse quello sopra non è quello che chiedi, ho provato questo nel tag head, e a me funziona:
<style>
#imContent{
position:relative;
height: 100%;
background: url(files/1.jpg) no-repeat center center;
background-size:cover;
}
</style>
provalo e facci sapere...
Author
oddio, mi rispondi in arabo
..... ora provo a seguire passo passo e ti dico, grazie!
Author
no, allora inserendo quello che hai scritto prima della chiusura del tag body non cambia nulla;
inserendo la 1a soluzione prima della chiusura del tag Head sparisce tutto il contenuto della homepage, immagine di sfondo e contenuti;
inserendo la 2a soluzione, sparisce solo l'immagine dello sfondo, il contenuto e normale.
Però mi hai messo sulla strada giusta, cioè provare a cambiare le proprietà dalla pagina: avevo impostato "adatta contenuto alla finestra", ma impostando "non ripetere" le proporzioni dell'immagine rimangono fisse e quindi va bene
! Per ora viene fuori ugualmente un'assurdità ma provo ad elimiare un po' contenuti per il responsive.
Grazie!!!