Elementi pozicioniranja na spletni strani z lastnostjo položaja CSS

Maj 4, 2024

Pred kaskadnimi tabelami s stiki ste bili omejeni v nadzoru nad položajem predmetov na svoji spletni strani. Tabelo HTML lahko uporabite za nadzor nad pozicioniranjem, vendar to ni bilo zelo natančno. Zdaj lahko s CSS-om natančno nadzorujete, kako se vsak element nahaja na vaši spletni strani.

Preden lahko lastnost položaja CSS uporabite za pozicioniranje elementov na svoji spletni strani, moramo razpravljati o terminologiji, ki se uporablja za komunikacijo s spletnim brskalnikom. CSS ne upošteva samo širine in višine vaše spletne strani, temveč tudi dimenzije spletnega brskalnika.

Širina in višina brskalnika
Sprva si lahko mislite, da se to nanaša na odprto okno brskalnika. Res pa se nanaša na celoten brskalnik, vključno z gumbi in gumbi.
Širina in višina v živo
To je izraz za območje prikaza brskalnika. Ne vključuje kontrol.
Širina in višina dokumenta
To je celotna širina in višina vaše spletne strani. Če so te dimenzije večje od širine in višine v živo, bo brskalnik po potrebi prikazal drsne trake.

Zdaj, ko poznate izraze za meje, v katere lahko postavite dele svoje spletne strani s pomočjo CSS, poglejmo štiri vrednosti položaja.

Statični
To je privzeto. Če za element ne določite drugače, bo brskalnik uporabil statično pozicioniranje. Tako kot se sliši, s statičnim pozicioniranjem ne morete premeščati elementov na spletni strani. Kako brskalnik določa, kam naj vsak predmet postavi na svojo spletno stran? Vsak element umesti v vrstni red, kot ga imajo v kodi HTML. Če imate logotip, pozdravo in nato obvestilo o avtorskih pravicah v vašem HTML-ju, bo brskalnik to postavil na spletno stran v tem zaporedju. Pozdrava ne morete premakniti nad sliko logotipa.
Relativni
Relativno pozicioniranje deluje enako kot statično, ker vrstni red elementov v kodi HTML nadzoruje pretok elementov na strani. Lahko pa uporabite relativno pozicioniranje za nadzor položaja elementa v primerjavi z drugimi elementi na spletni strani.
Absolutna
Če uporabljate absolutno pozicioniranje z elementom, bo ta element postal neodvisen od preostale spletne strani. Ker umestitev ni več določena z vrstnim redom HTML-ja, boste morali za postavitev elementa uporabiti koordinate X in Y.
Popravljeno
To deluje enako kot absolutno pozicioniranje. Vendar element, ki ima določeno pozicioniranje, se ne bo pomikal s spletno stranjo. To je lepo funkcijo, ki jo uporabljate za logotip ali meni, ki želite ostati vidni, ko se stran pomika navzgor.

Navodila Video: Web Development - Computer Science for Business Leaders 2016 (Maj 2024).

Elementi pozicioniranja na spletni strani z lastnostjo CSS Position, HTML, CSS, lastnost položaja CSS, statično pozicioniranje, relativno pozicioniranje, absolutno pozicioniranje, fiksno pozicioniranje, kako pozicionirati elemente na spletni strani, uporabite CSS za pozicioniranje elementov na spletni strani

Prejšnji Članek

Naslednji Članek

Podobni Članki

računalniki

Programska oprema Flash Ecard Server

Maj 2024

Če razmišljate o ustanovitvi lastne storitve Flash ecard, boste poleg kopije Adobe potrebovali še nekaj stvariR FlashR. Poleg ustvarjanja Flash animacije za Flash e-poštno kartico potrebujete program...

računalniki

Prekrivni položaji v meniju Flash Storybook prekrivajo

Maj 2024

V tej vadnici bomo na strani s prekrivanjem v meniju z nastavitvami za naš Flash postavili položaje X in Y za vsak elementR aplikacija za zgodbe. Te vrednosti bomo uporabili z našo kodo ActionScript,...