"Footer" është zakonisht blloku më i poshtëm i faqosjes së faqes në internet. Vështirësia më e zakonshme në pozicionimin e këtij fund-faqja është që ajo të vendoset gjithmonë në fund të dritares, pavarësisht nga plotësia e faqes ose lloji i shfletuesit. Ka pasur mjaft zgjidhje për problemin që nga koha e tranzicionit masiv në vendosjen e bllokut, dhe njëra prej tyre është dhënë më poshtë.
Është e nevojshme
Njohuri themelore të CSS dhe HTML
Udhëzimet
Hapi 1
Le të marrim si bazë skemën më të zakonshme të paraqitjes së faqeve - tre blloqe të vendosura njëra mbi tjetrën. Pjesa e sipërme (koka) duhet të jetë gjithmonë e vendosur në kufirin e sipërm të dritares, pjesa e poshtme (fundi) - në kufirin e poshtëm, dhe (trupi) kryesor duhet të mbushë gjithmonë të gjithë hapësirën ndërmjet tyre. Kodi burimor duhet të përmbajë një lidhje me specifikimin Tranzitor XHTML 1.0 dhe përshkrimi i stileve duhet të vendoset në një skedar të jashtëm CSS (për të shmangur problemet me Opera 9. XX). Përshkrimi HTML i strukturës duhet të vendoset në pjesën kryesore trupi i faqes. Do të fillojë, natyrisht, nga blloku i sipërm, në etiketën e të cilit duhet të vendoset një atribut identifikues me një vlerë, për shembull, divHead:
Bllok i kokës.
Blloku kryesor duhet të përbëhet nga një palë blloqesh të ngulitura. Një e jashtme do të jepet identifikuesi divOut, dhe ai i brendshëm - div Përmbajtja:
Përmbajtja kryesore.
Fundfaqja është vendosur në divFoot:
Fund faqja.
Hapi 2
Kodi i plotë HTML i faqes duhet të duket kështu:
Tre blloqe
@import "style.css";
Ky është një bllok header.
Përmbajtja kryesore.
Ky është fundi i faqes.
Hapi 3
Përshkrimi i stilit zbaton mekanizmin e paraqitjes së mëposhtme: blloku i mesëm (divOut) është vendosur në 100% lartësi, blloku i sipërm (divHead) do të ketë pozicionim absolut, dhe ai i poshtëm - relativ. Në bllokun kryesor të përmbajtjes (divContent), duhet të ketë një hapësirë të lirë në krye të barabartë me lartësinë e bllokut të titullit në mënyrë që të mos mbivendoset përmbajtja kryesore e faqes. Dhe blloku i poshtëm (fund i faqes) duhet të ketë një diferencë negative në krye, e barabartë me lartësinë e këtij blloku. Kjo do ta ngrejë atë mbi kufirin e poshtëm të dritares së shfletuesit. Ky mekanizëm mund të zbatohet duke përdorur një skedar css me përmbajtjen vijuese: * {margin: 0; mbushje: 0}
html, trupi {lartësia: 100%;} trupi {
pozicioni: relativ;
ngjyra: # 000;
}
#divOut {
diferencë: 0;
min-lartësia: 100%;
sfondi: #FFF;
ngjyra: # 000;
}
* html #divOut {lartësia: 100%;}
#divHead {
pozicioni: absolut;
majtas: 0;
maja: 0;
gjerësia: 100%;
lartësia: 80px;
sfond: # 2F5000;
tejmbushje: e fshehur;
rreshtimi i tekstit: qendra;
ngjyra: #FFF;
} #divFoot {
pozicioni: relativ;
qartë: të dy;
margin-top: -60px;
lartësia: 60px;
gjerësia: 100%;
ngjyra e sfondit: # 2F5000;
rreshtimi i tekstit: qendra;
ngjyra: #FFF;
}
.divContent {
gjerësia: 100%;
noton: majtas;
mbushja e sipërme: 81px;
} Emri që specifikuat për fletën e stileve në kodin HTML është style.css.
