|
|
|
Tudi sezname zna CSS lepo obdelati
Uf, to je lepa lastnost, saj lahko z njeno pomočjo postavimo poljubno sličico kot oznako seznama. Na spodnjem primeru si poglejte seznam z znanim smeškom:
| Smeško kot oznaka elementa v seznamu ([Ogled]) |
<html>
<style>
ul { list-style-image: url("smesko.gif"); }
</style>
<body>
<ul>
<li>prvi element</li>
<li>drugi element</li>
<li>tretji element</li>
</ul>
</body>
</html>
|
Ta lastnost pove, ali se oznaka nahaja povsem levo od seznama (ouside), ali pa je poravnana z drugo vrstico (inside). Da boste videli razliko, morate okno tako zožiti, da bo tekst vsaj v dveh vrsticah:
| Oznake elementov zunaj ali znotraj ([Ogled]) |
outside:
* prva vrstica prvega elementa
druga vrstica prvega elementa
tretja vrstica prvega elementa
* prva vrstica drugega elementa
druga vrstica drugega elementa
tretja vrstica drugega elementa
inside:
* prva vrstica prvega elementa
druga vrstica prvega elementa
tretja vrstica prvega elementa
* prva vrstica drugega elementa
druga vrstica drugega elementa
tretja vrstica drugega elementa
<html>
<style>
ul { list-style-image: url("smesko.gif"); }
ul.prvi { list-style-position: inside; }
ul#drugi { list-style-position: outside; }
</style>
<body>
'Navaden' seznam:
<ul>
<li>prvi element</li>
<li>drugi element</li>
<li>tretji element</li>
</ul>
Seznam s pozicijo 'inside':
<ul class="prvi">
<li>prvi element</li>
<li>drugi element</li>
<li>tretji element</li>
</ul>
Seznam s pozicijo 'outside':
<ul ID="drugi">
<li>prvi element</li>
<li>drugi element</li>
<li>tretji element</li>
</ul>
</body>
</html>
|
S to lastnostjo lahko določite izgled oznak. Lastnost lahko ima sledeče vrednosti:
To pa je lastnost, s katero lahko naenkrat nastavimo vse parametre, ki pa jih moramo zapisati v zaporedju:
|
|
|