HTML contine cateva tag-uri utile pentru asezarea continutului in pagina. Prin acestea textul este mai usor de citit si evidentiat.
Elementele pentru marcatori si numerotare
Un element des folosit in formarea listelor (neordonate) este <ul>.
- - <ul> este elementul de început si dupa scrierea listei se incheie cu </ul>.
- - Majoritatea elementelor pentru marcatori si numerotare sunt compuse din unu sau mai multe elemente <li> ... </li> (list element). Fara atributul "type" specificat in "<ul>" acestea prezintă un marcaj ca un bullet.
Mai jos puteti vedea exemplu.
<!DOCTYPE html>
<html>
<head>
<title>titlu documentului</title>
</head>
<body>
<ul>
<li>List item 1 ...</li>
<li>List item 2 ...</li>
<li>List item 3 ...</li>
</ul>
</body>
</html>
- Sunt 3 tipuri de marcaje:
disc, circle (
cerc) si
square (
patrat)
- Tipul de marcaj care se doreste folosit se introduce cu proprietatea CSS:
list-style-type in "style".
- Exemplu:
<!DOCTYPE html>
<html>
<head>
<title>titlu documentului</title>
</head>
<body>
<ul style="list-style-type: square;">
<li>List item 1 ...</li>
<li>List item 2 ...</li>
<li>List item 3 ...</li>
</ul>
</body>
</html>
Un alt element folosit pentru formarea listelor (ordonate numeric) este
<ol>.
<!DOCTYPE html>
<html>
<head>
<title>titlu documentului</title>
</head>
<body>
<ol>
<li>List item 1 ...</li>
<li>List item 2 ...</li>
<li>List item 3 ...</li>
</ol>
</body>
</html>
Sunt mai multe tipuri de numerotare care pot fi folosite. Acestea sunt controlate de atributul "
type" care este adaugat in elementul
<ol>, le puteti vetea mai jos:
- - type="1" - stil: 1, 2, 3, ...
- - type="a" - stil: a, b, c, ...
- - type="i" - stil: i, ii, iii, ...
- - type="I" - stil: I, II, III, ...
De asemenea se poate specifica numarul de inceput al numerotarii printr-o valoare data atributului:
start.
Se poate inversa numerotare aplicand atributul:
reversed.
Exemplu:
<!DOCTYPE html>
<html>
<head>
<title>titlu documentului</title>
</head>
<body>
<ol type="a">
<li>List item 1 ...</li>
<li>List item 2 ...</li>
<li>List item 3 ...</li>
</ol>
- Alta lista, start 3, inversa:
<ol type="I" start="3" reversed>
<li>List item 1 ...</li>
<li>List item 2 ...</li>
<li>List item 3 ...</li>
</ol>
</body>
</html>
Alte elemente pentru asezarea textului in pagina
Alte elemente pentru asezarea textului sunt: tag-ul <dl>, care cuprinde in el elementele <dt> si <dd>
- - <dl> ... </dl> este folosit (impreuna cu "dt" si "dd") pentru definirea si incadrarea unei liste de definitii.
- - <dt> ... </dt> Defineste elementul din lista. Fiecare tip de astfel de element trebuie precedad de unul sau mai multe elemente <dd> ... </dd>, folosite pentru descrierea elementului definit.
Aceste elemente ajuta pentru a da un aspect ordonat si placut textului si a putea face o separare mai buna a continutului.
In urmatorul exemplu puteti vedea cum se folosesc aceste elemente :
<!DOCTYPE html>
<html>
<head>
<title>titlu documentului</title>
</head>
<body>
<dl>
<dt>HTML</dt>
<dd> - Hyper Text Markup Language</dd>
<dd> - Limbaj pentru pagini web</dd>
<dt>Dog</dt>
<dd>dog = caine</dd>
<dd>animal de casa</dd>
</dl>
</body>
</html>
Pentru o eficienta mai buna se pot combina elementele de marcaj si numerotare, introducand elementele
<ul> si
<ol> imbricate (
unele in celelalte) impreuna cu elementele
<li>
Exemplu:
<!DOCTYPE html>
<html>
<head>
<title>titlu documentului</title>
</head>
<body>
<ul type="square">
<li> List item 1 ... </li>
<li> List item 2 ...
<ol type="a" start="3">
<li> Alt List item ... </li>
<li> Alt List item ... </li>
</ol></li>
<li> List item 5 ... </li>
</ul>
</body>
</html>
- Observati ca tot ce contine "<ol> ... </ol>" este adaugat in cadrul unui "<li> </li>".
Un Test simplu in fiecare zi
HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Clic pe tag-ul care creaza o lista ordonata numeric
<ul> <tr> <ol><ol>
<li>List-1</li>
<li>List-2</li>
</ol>
Care selector reprezinta ID-ul unui element in CSS
.nume #nume nume#id {
color: #0110fb;
}Ce cod creaza un obiect in JavaScript?
{} [] new Date()var obj = {"site": "CoursesWeb.net", "pr": 5};
alert(obj.site);Indicati instructiunea prin care se verifica daca o conditie este True sau False
else if() switch()$var = 8;
if($var == 8) echo $var;
Indicati timpul Prezent pentru verbul "to be" (a fi).
be were isNow, it is here.
- Acum este aici.
Care este conjugarea la timpul prezent al verbului "divertirse" (a se distra) la forma "yo"?
te diviertas me divierto se diviertaYo me divierto.
- Eu ma distrez.