Uporabite kodo CSS za poravnavo označenih seznamov v HTML.
Spletni oblikovalci uporabljajo označevalne sezname za več kot le za dodajanje oznak in besedila. Oznaka HTML, ki se uporablja za ustvarjanje označenih seznamov, je priročna za ustvarjanje menijev ali organiziranje slik za JavaScript, ki se naložijo v diaprojekcijo. Če se boste naučili uporabljati kaskadno kodo lista s slogi v povezavi s seznami oznak - v slengu HTML se imenujejo "neurejeni seznami" - bo odprlo več vznemirljivih možnosti spletnega oblikovanja.
Korak 1
Odprite datoteko HTML, ki vsebuje označen seznam, in poglejte med oznakami in proti vrhu kode. Dodajte oznake, če še niso prisotne. Če vaša koda vključuje a oznaka nekje za oznako in to vsebuje sklic na datoteko CSS, nato pa odprite to datoteko. Vaša koda CSS gre med oznake ali v novo vrstico vaše datoteke CSS.
Video dneva
2. korak
Poravnajte besedilo znotraj vseh oznak tako, da nastavite "text-align" za svoje
- oznaka. The
- in oznake, da jih definirate kot del enega samega seznama. Ko poravnate besedilo za
- oznaka se ovije okoli
- tag, poravnava vpliva na besedilo v vsaki oznaki, vendar ne poravna samega seznama na levo ali desno stran strani. Tukaj je primer kode CSS za nastavitev "text-align":
ul {text-align: right;}
Upoštevajte, da se krogle ne premikajo z besedilom. V tem primeru krogle ostanejo na levi.
3. korak
Poravnajte celoten seznam na levo ali desno stran strani, tako da nastavite "float" za svoj
- oznaka. Ko je "float" nastavljen na levo ali desno na a
- oznaka, premakne celoten označeni seznam na levo ali desno stran strani. Nastavite float takole:
ul {float: desno;}
Nastavite lahko "float" levo ali desno, ne pa na sredino.
4. korak
Zavijte svoje
- oznake v
in
oznake, da ustvarite ovoj, ki bo središčen označen seznam na vaši strani. Vaša končna koda bo videti takole:- Element seznama
- Element seznama
The
oznaka sama ne centrira ničesar; za centriranje vsega morate uporabiti CSS. Dodajte naslednjo kodo med svoje
