Come forzare un piè di pagina per stare in basso con i CSS

April 8

Piè di pagina, che appaiono in fondo alla pagine, di solito contengono link alle sezioni importanti su un sito web. CSS ha una proprietà chiamata "dal basso", che permette ai progettisti del sito per posizionare gli oggetti relativi alla fine di una pagina. Impostando il valore di questa proprietà a zero, è possibile forzare i tuoi piè di aderire perfettamente alla parte inferiore di ogni pagina Web.

istruzione

1 Aprire qualsiasi documento HTML utilizzando il blocco note o un editor HTML.

2 Aggiungere il seguente elemento div alla sezione corpo della pagina:

<Div class = "bottom">

Questo è un testo all'interno del footer

</ Div>

Questo div contiene il testo piè di pagina di esempio e un riferimento a una classe CSS denominato "fondo".

3 Incollare il codice riportato di seguito nella sezione head del documento:

.parte inferiore {

position: absolute;

text-align: center;

width: 100%;

bottom: 0px;

width: 100%;

}

Questa classe CSS - a cui fa riferimento il div - costringe il div a galleggiare sul fondo della pagina Web. La struttura inferiore, impostato su "0px" in questo esempio, mantiene il div in basso.

4 Salvare il documento e visualizzarlo nel browser per confermare che il piè di pagina viene visualizzata nella parte inferiore della pagina Web.

Consigli e avvertenze

  • Mettere tutti gli elementi HTML che ti piace, come link, all'interno della div. Essi diventano parte del vostro piè di pagina e si muovono ovunque si posiziona il div
  • La definizione della classe CSS mantiene il filo piè di pagina con la parte inferiore della pagina Web. Se si preferisce spostare il piè di pagina un po ', modificare il valore della proprietà "dal basso" da "0px" ad un valore diverso. Per esempio, per forzare il piè di pagina appaia 20 pixel al di sopra della parte inferiore della pagina, impostare il valore della proprietà di fondo a "20px".