WebSite X5Help Center

 
Lorenzo S.
Lorenzo S.
User

Immagine adattiva in una pagina  it

Autor: Lorenzo S.
Visitado 898, Seguidores 1, Compartilhado 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?

Publicado em
16 RESPOSTAS
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....

Ler mais
Publicado em de Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Autor

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?

Ler mais
Publicado em de Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator

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

Ler mais
Publicado em de Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Autor
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>

Ler mais
Publicado em de Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator

stessa cosa...

Ler mais
Publicado em de Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Autor

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" 

Ler mais
Publicado em de Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator

un link per vedere...?

Ler mais
Publicado em de 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>

Ler mais
Publicado em de Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Autor

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

Ler mais
Publicado em de 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....

Ler mais
Publicado em de Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Autor

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?"

Ler mais
Publicado em de 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>

Ler mais
Publicado em de Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Autor
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? 

Ler mais
Publicado em de Lorenzo S.
Mirko Boschetti
Mirko Boschetti
Moderator
MirKo Boschetti
un link per vedere...?
Ler mais
Publicado em de Mirko Boschetti
Lorenzo S.
Lorenzo S.
User
Autor

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

Ler mais
Publicado em de Lorenzo S.