WebSite X5Help Center

 
Lorenzo S.
Lorenzo S.
User

Immagine adattiva in una pagina  it

Author: Lorenzo S.
Visited 900, Followers 1, Shared 0  

Ciao a tutti  volevo chiedervi una cosa, avendo avuto la necessità di togliere la slideshow dell'intestazione di alcune pagine tramite questo codice:

<style type="text/css">

#imHeader {display: none;}

</style>

ora in quelle pagine vorrei aggiungere 1 immagine di un 100naio di pixel come altezza che sia adattata allo schermo per sostituire quello che prima era la slideshow.

Sapete come posso fare?

Posted on the
16 ANSWERS
Mirko Boschetti
Mirko Boschetti
Moderator

prova a mettere questo nella proprietà della pagina interessata:

<style>#imHeader {height: 100px; background-color: transparent; background-image: url('files/immagine.jpg');</style>

cambiando l'immagine con la tua....

Read more
Posted on the from Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Author

ciao Mirko ti ringrazio per la risposta, però non capisco una cosa:

allora in una pagina a caso inserisco un html e aggiungo la foto mettiamo che si chiami "immagine22.jpg" come persorso "files"

Vado in proprietà della pagina dove mi interessa cambiare l'ntestazione inserisco prima della chiusura del tasto Head:

<style type="text/css">

#imHeader {display: none;}

</style>

<style>#imHeader {height: 100px; background-color: transparent; background-image: url('files/immagine22.jpg');</style>

Dov'è che sbaglio?

Read more
Posted on the from Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator

questo non serve...#imHeader {display: none;}

Read more
Posted on the from Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Author
MirKo Boschetti
questo non serve...#imHeader {display: none;}

devo compilarlo così:

<style type="text/css">

#imHeader {height: 100px; background-color: transparent; background-image: url('files/immagine22.jpg');

</style>

o così: 

<style>

#imHeader {height: 100px; background-color: transparent; background-image: url('files/immagine22.jpg');

</style>

Read more
Posted on the from Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator

stessa cosa...

Read more
Posted on the from Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Author

purtroppo si carica l'intestazione originale sopra, inoltre la larghezza dell'immagine al posto di essere adattata allo schermo ha la larghezza del "contenuto della pagina" 

Read more
Posted on the from Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator

un link per vedere...?

Read more
Posted on the from Mirko Boschetti
Mirko Boschetti
Mirko Boschetti
Moderator

al limite prova anche questo, con un immagine di 1600 di larghezza....

<style>

#imHeaderBg {background-image: url ('files/immagine22.jpg');background-position: left top; }

</style>

Read more
Posted on the from Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Author

Al momento il sito di prova ce l'ho solo il locale, lo pubblico su altervista e poi metto il link.

Read more
Posted on the from Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator

prova questa all'interno del tag body, in proprietà pagina...

<div style="position: absolute; top: 200px; left: 0px; width: 100%; height: 150px; overflow: hidden;"><img src="files/imagine.jpg" width="100%"></div>

cambia le misure del top, come serve a te....

Read more
Posted on the from Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Author

ho provato ad inserire prima della chiusura del tag body solo che purtroppo esce una riga grigia di 1px da parte a parte e comunque rimane l'intestazione.

Mi sa che è più complesso di quello che avevo previsto

Tuttavia per quanto riguarda la mia ultima domanda sai darmi un consiglio? 

"se volessi dal "punto 3" inserire un'immagine e che si adattasse con questi 100px di altezza sempre adattata alla pagina e non solo alle dimensioni del "contenuto della pagina" come dovrei fare?"

Read more
Posted on the from Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator

anzi era un'altro...prova questo della mia prova:

<div style="background: url('files/frec1.png')no-repeat center center; position:absolute; right:0px; width:100%; top:-20px; height:500px;"></div>

Read more
Posted on the from Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Author
MirKo Boschetti
anzi era un'altro...prova questo della mia prova: <div style="background: url('files/frec1.png')no-repeat center center; position:absolute; right:0px; width:100%; top:-20px; height:500px;"></div>

il codice funziona per il discorso intestazione però rimane ancora la questione che l'intestazione vecchia rimane...

Detto questo invece per quanto riguarda il punto:

"se volessi dal "punto 3" inserire un'immagine e che si adattasse con questi 100px di altezza sempre adattata alla pagina e non solo alle dimensioni del "contenuto della pagina" come dovrei fare?"

quest'ultimo codice come lo metto? 

Read more
Posted on the from Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator
MirKo Boschetti
un link per vedere...?
Read more
Posted on the from Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Author

questa è la prova tralasciando le immagini utilizzate sull'intestazione http://sitoprovajoomla123.altervista.org/

Ora mi chiedo, anche vedendo la sorgente della pagina qui: http://www.provews.altervista.org/div_sfondo/  non riesco a capire come tu oltre all'intestazione abbia fatto mettere le immagini durante il testo, di sicuro sono state fatte al "punto 3" adesso il problema è:

che devo fare per metterle?

ho fatto una prova al "punto 3" che troverai nella "pagina1" come vedi non si è adattata alla pagina

Read more
Posted on the from Lorenzo S.