A listák formázása CSS-el
Most a lista formázásokról szeretnék veletek beszélni, először is maradjunk a felsorolásnál, tehát a lista eredeti funkciójánál. Két részre venném a dolgot, a számozott és a nem számozott listákra. Nézzük is meg őket :)
A külömbség a kettő között, az hogy máshogy deklaráljuk őket.
A pontozott lista: <ul></u>
Amíg a számozott: <ol></ol>
A kettő között a kapcsolat pedig az hogy az alap tag-en belül lis <li></li> tagek találhatóak meg. Maguk a listaelemek. A CSS-ben kitérhetünk csak a li formázására is abban az esetben ha például nem fogunk számozott listát alkalmazni. Ha mindkettőt használnánk akkor az ul illetve az ol szavakkal hivatkozzunk rájuk a css-ben.
Három tulajdonsága van egy listának:
list-style-position, vagyis a kis felsorolás jelek helyzete. Ez lehet inside ilyenkor a listaelemmel együtt "mozog" és outside amikor elkülönül.
list-style-image, avagy saját képet állíthatsz be listaelemként, ezt érdemes a nem számozott listáknál használni
list-style-type , vagyis a kis listajel típusa
Felsorolásokhoz: disc, circle, square
Számozott listákhoz: decimal, decimal-leading-zero, lower-roman, upper-roman, lower-greek, lower-latin, upper-latin, armenian, georgian, lower-alpha, upper-alpha
És ha nem akarsz semmit, egyszerűen csak: none
Persze ezeken kívül formázhatod még a listaelemek színét, méretét, csak ez az a 3 dolog amitől a lista lista.
Pár plusz dolog a számozott listáról:
Így fordítod meg: <ol reversed></ol>
És így adsz neki kezdőszámot: <ol start="23"></ol>
Mindenkinek jó listázgatást, remélem segítettem :)
|