Stiluri pentru liste
Pagina 1 din 1
Stiluri pentru liste
list-style-type
Folosind eticheta ol din HTML cream liste ordonate sau numerotate. Adăugând comenzi CSS în zona HEAD putem adăuga pe lângă numere şi cifre sau alte simboluri. Browserul Netscape nu permite asocierea comenzilor CSS decât pentru eticheta li.
Sintaxa este:
Cod:
<style type="text/css">
<!--
li {list-style-type: valoare;}
-->
</style>
Valoarea poate fi:
*disc=disc
*circle=cerc
*square=patrat
*decimal=nr. intregi
*lower-roman=numere romane, caractere mici (i, ii, iii, iv)
*upper-roman=numere romane, caractere mari (I, II, III, IV)
*upper-alpha=litere mari (A, B, C, D)
*lower-alpha=litere mici (a, b, c, d)
*none=nimic
Exemplu: lista ordonată folosind marcaje cu litere mici:
Cod:
<html>
<head>
<title>Exemplu</title>
<style type="text/css">
<!--
li {list-style-type: lower-alpha;}
-->
</style>
</head>
<body>
Necesar materiale:
<ol>
<li>caramida</li>
<li>ciment</li>
<li>ipsos</li>
</ol>
</body>
</html>
list-style-image
În afara simbolurilor de marcaj prestabilite cunoscute de browser pot fi folosite şi imagini prin comanda CSS list-style-image. Imaginile sunt introduse prin adresa url().
Exemplu: lista ordonată folosind ca marcaj imaginea punct.gif
Cod:
<html>
<head>
<title>Exemplu</title>
<style type="text/css">
<!--
li {list-style-image: url(punct.gif);}
-->
</style>
</head>
<body>
Necesar materiale:
<ul>
<li>caramida</li>
<li>ciment</li>
<li>ipsos</li>
</ul>
</body>
</html>
Folosind eticheta ol din HTML cream liste ordonate sau numerotate. Adăugând comenzi CSS în zona HEAD putem adăuga pe lângă numere şi cifre sau alte simboluri. Browserul Netscape nu permite asocierea comenzilor CSS decât pentru eticheta li.
Sintaxa este:
Cod:
<style type="text/css">
<!--
li {list-style-type: valoare;}
-->
</style>
Valoarea poate fi:
*disc=disc
*circle=cerc
*square=patrat
*decimal=nr. intregi
*lower-roman=numere romane, caractere mici (i, ii, iii, iv)
*upper-roman=numere romane, caractere mari (I, II, III, IV)
*upper-alpha=litere mari (A, B, C, D)
*lower-alpha=litere mici (a, b, c, d)
*none=nimic
Exemplu: lista ordonată folosind marcaje cu litere mici:
Cod:
<html>
<head>
<title>Exemplu</title>
<style type="text/css">
<!--
li {list-style-type: lower-alpha;}
-->
</style>
</head>
<body>
Necesar materiale:
<ol>
<li>caramida</li>
<li>ciment</li>
<li>ipsos</li>
</ol>
</body>
</html>
list-style-image
În afara simbolurilor de marcaj prestabilite cunoscute de browser pot fi folosite şi imagini prin comanda CSS list-style-image. Imaginile sunt introduse prin adresa url().
Exemplu: lista ordonată folosind ca marcaj imaginea punct.gif
Cod:
<html>
<head>
<title>Exemplu</title>
<style type="text/css">
<!--
li {list-style-image: url(punct.gif);}
-->
</style>
</head>
<body>
Necesar materiale:
<ul>
<li>caramida</li>
<li>ciment</li>
<li>ipsos</li>
</ul>
</body>
</html>
Pagina 1 din 1
Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum
|
|