Liste ordonate si neordonate in HTML

Tag-ul <ol ...>...</ol>

Liste ordonate - SINTAXA

<ol lista_atribute>
    <li lista_ atribute >text</li>
    <li lista_ atribute >text</li>
    …………
    <li lista_ atribute >text</li>
</ol>

Lista de atribute

EXEMPLUL 1

În exemplul următor se creaza o lista ordonata simpla.

<!doctype html5>
<html>
<head>
<title> Lista ordonata </title>
</head>
<body >
    <ol>
        <li>Lista punct 1</li>
        <li>Lista punct 2</li>
        .......
        <li>Lista punct n</li>
    </ol>
</body>
</html>
Clik aici pt vizualizare exemplu

EXEMPLUL 2

În exemplul următor se creaza o lista ordonata utilizand mai multe stiluri.

<!doctype html5>
<html>
<head><title>Link-uri</title></head>
<body>
    <ol type="I" style="color:#8b0000;">
        <li>Lista punct 1</li>
        <li>Lista punct 2</li>
        .......
        <li style="font-family:chiller">Lista punct n</li>
    </ol>
 </body>
</html>
Clik aici pt vizualizare exemplu

Tag-ul <ul ...>...</ul>

Liste neordonate - SINTAXA

<ul lista_atribute>
    <li lista_ atribute >text</li>
    <li lista_ atribute >text</li>
    …………
    <li lista_ atribute >text</li>
</ul>

Lista de atribute

EXEMPLUL 3

În exemplul următor se creaza o lista neordonata simpla.

<!doctype html5>
<html>
<head>
<title> Lista neordonata </title>
</head>
<body >
    <ul>
        <li>Lista punct 1</li>
        <li>Lista punct 2</li>
        .......
        <li>Lista punct n</li>
    </ul>
 </body>
</html>
Clik aici pt vizualizare exemplu

EXEMPLUL 4

În exemplul următor se creaza o lista neordonata utilizand mai multe stiluri.

<!doctype html5>
<html>
<head><title>Lista neordonata</title></head>
<body>
    <ul type="circle" style="color:#8b0000;">
        <li>Lista punct 1</li>
        <li>Lista punct 2</li>
        .......
        <li style="font-family:algerian">Lista punct n</li>
    </ul>
 </body>
</html>
Clik aici pt vizualizare exemplu

Fişă de lucru

  1. Scrieţi codurile HTML de mai sus în pagini web diferite sau utilizati aceeasi pagina şi rulaţile într-un browser.
  2. Modificaţi parametrii tagurilor utilizate.
  3. Modificaţi pagina web pentru hobby-ul preferat adăugând liste ordonate si neordonate.