[HTML] creazione piè di pagina nelle pagine

BeLakor · 23-09-2010, 22:12

Ciao,
avrei la necessità di creare un piè di pagina nel mio documento .html.
Ovviamente il footer deve essere a posizione fissa e si deve ripetere su tutte le pagine in fase di stampa.
Qualcuno ha idee?

Ho provato così:

Codice:

<html><head><style type="text/css">
p.piede{position:absolute;left:50%;right:50%;bottom:0px;}
</style></head><body>
<p class=piede>sono un pie di pagina</p>
</body></html>

Ma niente da fare....nemmeno sull'ultima pagina si posiziona correttamente a fondo pagina....Figurarsi se si ripete su tutte in fase di stampa

BeLakor

Antares88 · 23-09-2010, 23:37

Dovresti essere un pò più preciso su come è realizzata la struttura del sito.
Hai usato php, asp, ajax ? oppure è html pulito ?

Hai un'intelaiatura all'interno della quale vengono caricate le pagine tramite un sistema di navigazione ? se si, come funziona ? è via GET (index.php?page=galleria), via ajax via cosa?

Ipotizzando che tu abbia una pagina php che contiene lo scheletro del sito e carica i contenuti dinamicamente, è all'interno di questa pagina che in fondo dovresti caricare il footer (pié di pagina) tramite include.

BeLakor · 24-09-2010, 09:40

Hai fatto tutto tu

Io ho chiaramente parlato di documento .html.
Non esiste sito nè altro.
Il prossimo...

BeLakor

Antares88 · 24-09-2010, 11:52

Quote:

Originariamente inviato da BeLakor

Hai fatto tutto tu

Io ho chiaramente parlato di documento .html.
Non esiste sito nè altro.
Il prossimo...

BeLakor

E allora ti fai un div contenente quello che deve stare a fondo pagina e lo copi in tutte le pagine del sito. Non è che sia proprio il massimo, se poi vuoi cambiare qualcosa devi cambiare tutte le pagine del sito.

Cmq codice di esempio della tua pagina html:

Codice:

<html>
  <head>
    <!-- contenuto dell'head -->
  </head>
  <body>
    <!-- contenuto del body -->
      <div class="footer">
        <!-- contenuto del footer -->
      </div>
  </body>
</html>

BeLakor · 24-09-2010, 13:48

Con il <div> o con <p> il risultato non cambia.
Il mio documento .html è generato da Java riga per riga partendo da un template di base.
Non posso sapere quante pagina in stampa poi usciranno e anche se lo sapessi, basta che l'utente cambia il formato pagina di stampa da orizzontale a verticale ed ho perso il mio footer

Altre soluzioni?

BeLakor

Antares88 · 24-09-2010, 14:41

dato che stai generando la pagina in modo dinamico (è quello che ti chiedevo sopra, anche php genera codice html) il problema non è includere il div in tutte le pagine (che per altro semanticamente è cosa più corretta rispetto a usare un paragraph).
Il problema come dici tu è fare in modo che sia presente sulla stampa indipendentemente dall'orientamento del foglio utilizzato. Onestamente non so come puoi fare, magari sfruttando un css apposito per la stampa e trovando un modo di posizionare il div dinamicamente (javascript?)

BeLakor · 24-09-2010, 17:24

Quote:

Originariamente inviato da Antares88

dato che stai generando la pagina in modo dinamico (è quello che ti chiedevo sopra, anche php genera codice html) il problema non è includere il div in tutte le pagine (che per altro semanticamente è cosa più corretta rispetto a usare un paragraph).
Il problema come dici tu è fare in modo che sia presente sulla stampa indipendentemente dall'orientamento del foglio utilizzato. Onestamente non so come puoi fare, magari sfruttando un css apposito per la stampa e trovando un modo di posizionare il div dinamicamente (javascript?)

L'esempio con css è quello che ho postato nel primo esempio.
Javascript non mi viene in aiuto poichè non viene letto da OpenOffice o Word, in caso di salvataggi del file .html con estensione .doc o .odt.
Altre soluzioni?

BeLakor

astorcas · 24-09-2010, 18:27

Ti posto un esempio con una struttura basilare che spinge il footer sempre in fondo alla pagina.

Questo è un template della pagina:

Codice HTML:

<html>
    <head>
        <link rel="stylesheet" href="file.css"/>
    </head>
    <body>
        <div class="main">
            CONTENUTO PRINCIPALE
            <div class="spacer"></div>
        </div>
        <div class="footer">
            FOOTER
        </div>
    </body>
</html>

e questo del file file.css:

Codice PHP:


			
* {

margin: 0;

}

html, body {

height: 100%;

}

.wrapper {

min-height: 100%;

height: auto !important;

height: 100%;

margin: 0 auto -4em;

}

.footer, .spacer {

height: 4em;

}

il footer in pratica si sovrappone sul div con classe spacer (che per questo motivo va lasciato vuoto), per questo i due div devono avere la stessa altezza (una negativa e l'altra positiva).
Prova e fammi sapere

BeLakor · 28-09-2010, 19:18

Niente male come soluzione astorcas!

Qualche aggiustatina e dovrebbe fare al caso mio

BeLakor

23-09-2010, 22:12	#1
BeLakor Senior Member Iscritto dal: Dec 2006 Città: Lodi Messaggi: 588	[HTML] creazione piè di pagina nelle pagine Ciao, avrei la necessità di creare un piè di pagina nel mio documento .html. Ovviamente il footer deve essere a posizione fissa e si deve ripetere su tutte le pagine in fase di stampa. Qualcuno ha idee? Ho provato così: Codice: <html><head><style type="text/css"> p.piede{position:absolute;left:50%;right:50%;bottom:0px;} </style></head><body> <p class=piede>sono un pie di pagina</p> </body></html> Ma niente da fare....nemmeno sull'ultima pagina si posiziona correttamente a fondo pagina....Figurarsi se si ripete su tutte in fase di stampa BeLakor __________________ HWBot - BeLakor Il mio PC: alimentatore LC POWER Arkangel 850Watt, scheda video Gigabyte GTX 970 4GB OC WF3, SSD Samsung 850 PRO, 2 Velociraptor 300 GB in raid 1, ASRock X99 OC Formula, 16GB G.Skill Ripjaws 4 Series DDR4-2400, I7 5820K

23-09-2010, 23:37	#2
Antares88 Senior Member Iscritto dal: Jan 2003 Città: Roma Messaggi: 832	Dovresti essere un pò più preciso su come è realizzata la struttura del sito. Hai usato php, asp, ajax ? oppure è html pulito ? Hai un'intelaiatura all'interno della quale vengono caricate le pagine tramite un sistema di navigazione ? se si, come funziona ? è via GET (index.php?page=galleria), via ajax via cosa? Ipotizzando che tu abbia una pagina php che contiene lo scheletro del sito e carica i contenuti dinamicamente, è all'interno di questa pagina che in fondo dovresti caricare il footer (pié di pagina) tramite include. __________________ Trattative concluse su mercatino: The_Saint, ewandeep, Wiltord, maurizioi, Compulsion, mauryxxx76

24-09-2010, 09:40	#3
BeLakor Senior Member Iscritto dal: Dec 2006 Città: Lodi Messaggi: 588	Hai fatto tutto tu Io ho chiaramente parlato di documento .html. Non esiste sito nè altro. Il prossimo... BeLakor __________________ HWBot - BeLakor Il mio PC: alimentatore LC POWER Arkangel 850Watt, scheda video Gigabyte GTX 970 4GB OC WF3, SSD Samsung 850 PRO, 2 Velociraptor 300 GB in raid 1, ASRock X99 OC Formula, 16GB G.Skill Ripjaws 4 Series DDR4-2400, I7 5820K

24-09-2010, 13:48	#5
BeLakor Senior Member Iscritto dal: Dec 2006 Città: Lodi Messaggi: 588	Con il <div> o con <p> il risultato non cambia. Il mio documento .html è generato da Java riga per riga partendo da un template di base. Non posso sapere quante pagina in stampa poi usciranno e anche se lo sapessi, basta che l'utente cambia il formato pagina di stampa da orizzontale a verticale ed ho perso il mio footer Altre soluzioni? BeLakor __________________ HWBot - BeLakor Il mio PC: alimentatore LC POWER Arkangel 850Watt, scheda video Gigabyte GTX 970 4GB OC WF3, SSD Samsung 850 PRO, 2 Velociraptor 300 GB in raid 1, ASRock X99 OC Formula, 16GB G.Skill Ripjaws 4 Series DDR4-2400, I7 5820K

24-09-2010, 14:41	#6
Antares88 Senior Member Iscritto dal: Jan 2003 Città: Roma Messaggi: 832	dato che stai generando la pagina in modo dinamico (è quello che ti chiedevo sopra, anche php genera codice html) il problema non è includere il div in tutte le pagine (che per altro semanticamente è cosa più corretta rispetto a usare un paragraph). Il problema come dici tu è fare in modo che sia presente sulla stampa indipendentemente dall'orientamento del foglio utilizzato. Onestamente non so come puoi fare, magari sfruttando un css apposito per la stampa e trovando un modo di posizionare il div dinamicamente (javascript?) __________________ Trattative concluse su mercatino: The_Saint, ewandeep, Wiltord, maurizioi, Compulsion, mauryxxx76

24-09-2010, 18:27	#8
astorcas Senior Member Iscritto dal: Jan 2005 Città: Siena Messaggi: 1313	Ti posto un esempio con una struttura basilare che spinge il footer sempre in fondo alla pagina. Questo è un template della pagina: Codice HTML: <html> <head> <link rel="stylesheet" href="file.css"/> </head> <body> <div class="main"> CONTENUTO PRINCIPALE <div class="spacer"></div> </div> <div class="footer"> FOOTER </div> </body> </html> e questo del file file.css: Codice PHP: `* { margin: 0; } html, body { height: 100%; } .wrapper { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -4em; } .footer, .spacer { height: 4em; }` il footer in pratica si sovrappone sul div con classe spacer (che per questo motivo va lasciato vuoto), per questo i due div devono avere la stessa altezza (una negativa e l'altra positiva). Prova e fammi sapere

28-09-2010, 19:18	#9
BeLakor Senior Member Iscritto dal: Dec 2006 Città: Lodi Messaggi: 588	Niente male come soluzione astorcas! Qualche aggiustatina e dovrebbe fare al caso mio BeLakor __________________ HWBot - BeLakor Il mio PC: alimentatore LC POWER Arkangel 850Watt, scheda video Gigabyte GTX 970 4GB OC WF3, SSD Samsung 850 PRO, 2 Velociraptor 300 GB in raid 1, ASRock X99 OC Formula, 16GB G.Skill Ripjaws 4 Series DDR4-2400, I7 5820K

Strumenti
Mostra una versione stampabile Invia questa pagina per email