Postavitev predmetov na spletni strani je bistvena za njegovo celotno zasnovo. Čeprav obstajajo drugi načini za vpliv na postavitev, na primer pri uporabi tabel ( ki jih ne priporočamo ), je najbolje, da uporabite CSS .
V nadaljevanju si bomo ogledali, kako uporabiti preprost slog CSS sloga za poravnavo slik, tabel, odstavkov in še več.
Opomba: Te iste metode se lahko uporabljajo tudi na zunanjih listih slogov, vendar se ti nanašajo na posamezne predmete in verjetno morajo ostati na tak način, najbolje je uporabiti spletno oblikovanje, kot je navedeno spodaj.
Poravnajte odstavke besedila
Oznaka odstavka je prvo mesto za začetek pri postavitvi vaše spletne strani. Odpiranje in zapiranje oznak je videti tako:
Privzeta poravnava besedila v odstavku je na levi strani strani, lahko pa tudi odstavke usmerite na desno in sredino.
Uporaba lastnosti plovca omogoča poravnavo odstavkov na desni ali levi od nadrejenega elementa. Vsi drugi elementi v tem nadrejenem elementu se bodo gibali okoli plavajočega elementa.
Za najboljši učinek z odstavkom je najbolje določiti širino v odstavku, ki je manjši od elementa vsebnika (staršev).
Poravnajte besedilo v notranjih odstavkih
Verjetno najbolj zanimiva poravnava besedila odstavka je "utemelji", kar govori brskalniku, da prikaže usklajeno besedilo v bistvu na desni in levi strani okna.
Če želite utemeljiti besedilo v odstavku, uporabite lastnosti za poravnavo besedila.
Vse besedilo lahko znotraj besedila poravnate tudi na desno ali levo (privzeto), s pomočjo lastnosti za poravnavo besedila.
Besedilo z aligniranjem besedila bo poravnalo besedilo znotraj elementa. Tehnično ne sme poravnati slik, ki so vsebovane znotraj odstavka ali drugega elementa, vendar večina brskalnikov obravnava slike kot inline za to znamko.
Poravnava slik
Uporaba lastnosti plovca na slikovni oznaki lahko določite postavitev slik na strani in kako se bo besedilo obrnilo okoli njih.
Tako kot zgornji odstavki, bo lastnost plavajočega sloga v slikovni oznaki postavila vašo sliko na stran in bo brskalniku sporočila, kako teči besedilo in druge elemente okoli slike.
Besedilo, ki sledi zgornji sliki, se bo slikal na sliki v desno, ko se slika prikaže na levi strani zaslona.
Če želim, da se besedilo ustavi z ovijanjem slike, uporabljam jasno lastnost:
Poravnava več kot odstavkov
Kaj pa, če želite uskladiti več kot le odstavek ali sliko? V vsakem odstavku lahko enostavno postavite lastnost sloga, vendar je oznaka, ki jo lahko uporabite, bolj učinkovito:
Preprosto obkrožajte besedilo in slike (vključno z oznakami HTML ) s oznako in slogovno lastnostjo (plavajočo ali poravnano besedilo) in vse, kar je v tem razdelku, bo usklajeno, kako vam je všeč.
Upoštevajte, da bodo poravnave, dodane odstavkom ali slikam znotraj oddelka, počaščene, prevladujočo oznako.