Sunteți pe pagina 1din 3

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

 type - determină cu ce semn vor începe elementele din listă.


o type="1" - stil: 1, 2, 3, ...
o type="a" - stil: a, b, c, ...
o type="i" - stil: i, ii, iii,...
o type="I" - stil: I, II, III, ...
 style - se pot introduce coduri css pentru stilul textului care va apărea în listă.
 start - dacă se dorește ca numerotarea să pornească de la o anumită valoare.

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

 type - determină cu ce semn vor începe elementele din listă. Acesta poate avea
valorile: disc, circle (cerc) și square (pătrat);
 style - se pot introduce coduri css pentru stilul textului care va apărea în listă.
 start - dacă se dorește ca numerotarea să pornească de la o anumită valoare.

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>

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>

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.

S-ar putea să vă placă și