Hvordan å tvinge en bunntekst til opphold nederst med CSS

Bunntekst, som vises nederst på sidene, vanligvis inneholde snarveier til viktige deler på en nettside. CSS har en egenskap kalt "bunnen" som gjør det mulig site designere til posisjon objekter i forhold til bunnen av en side. Ved å sette denne eiendommens verdi til null, kan du tvinge dine bunn å holde seg pent i bunnen av en Web-side.

Bruksanvisning

1 Åpne et HTML-dokument med Notepad eller HTML-editor.

2 Legg til følgende div element til sidens hoveddel:

<Div class = "bottom">

Dette er teksten i footer

</ Div>

Dette div inneholder eksempelbunntekst og en referanse til en CSS-klasse som heter "bunnen".

3 Lim inn koden nedenfor inn i dokumentet hode seksjon:

.bottom {

position: absolute;

text-align: center;

width: 100%;

bottom: 0px;

width: 100%;

}

Denne CSS-klasse - referert av div - tvinger div å flyte til bunnen av websiden. Bunnen eiendom, satt til "0px" i dette eksempelet holder div nederst.

4 Lagre dokumentet, og se den i nettleseren din for å bekrefte at bunnteksten vises nederst på websiden.

Hint

• Plasser noen HTML-elementer du liker, for eksempel koblinger, inne i div. De blir en del av bunntekst og flytte uansett hvor du plasserer div
• CSS-klasse definisjon holder bunnteksten i flukt med bunnen av websiden. Hvis du foretrekker å flytte bunnteksten opp litt, endre verdien av "bunnen" eiendom fra "0px" til en annen verdi. For eksempel, for å tvinge bunnteksten for å møte 20 piksler over bunnen av siden, satt nederst eiendommens verdi til "20px".