Forum

Bună ziua!,
Vă deranjez cu o întrebare, probabil banală. Deci, care este diferența dintre o clasă și un identificator? Când ar trebui să folosesc clasele (class) și când identificatorii (ID)?
O zi bună!!!

Diferenta dintre id si class este faptul ca se poate folosi acelasi atribut "class" la mai multe elemente HTML, pe cand "id" se foloseste numai pentru un singur element HTML din pagina.
- Cand vrei sa aplici acelasi stil css la mai multe elemente html diferite, le adaugi un "class" si se aplica proprietatile css la acea clasa.
- ID-ul se foloseste cand vrei sa aplici stiluri css la un anumit element html, de exemplu un Div, fara a afecta celelalte Div-uri.

1. Exemplu pentru "class":

Cod: Selectaţi tot

<html>
<head>
<title>Titlul</title>
<style type="text/css">
.cuvant {
  color:#1111fe;
  text-decoration:underline;
}
</style>
</head>
<body>
<h2 class="cuvant">Text ...</h2>
<h3 class="cuvant">Alt text ... </h3>
<h3>Alt tag H3</h3>
</body>
</html>

- In exemplu de sus, stilul creat poate fi folosit doar de elementele unde vom adauga comanda class="cuvant", celelalte elemente nefiind afectate.
In codul CSS selectorul (aici "cuvant") trebuie sa inceapa cu punct (.)

2. Un element html poate avea mai multe clase, adaugate in acelasi atribut "class", separate prin spatiu.
In exemplu urmator, tag-ul <h3> are 2 clase: "c_blue" si "bold_u"; iar Div-ul clasa "c_blue":

Cod: Selectaţi tot

<html>
<head>
<title>Titlul</title>
<style type="text/css">
.c_blue {
  color:#00f;
}
.bold_u {
  font-weight:700;
  text-decoration:underline;
}
</style>
</head>
<body>
<h3 class="c_blue bold_u">Text albastru, ingrosat si subliniat</h3>
<div class="c_blue">Text albastru </div>
<h3>Alt tag H3</h3>
</body>
</html>

3. Exemplu pentru "id":

Cod: Selectaţi tot

<html>
<head>
<title>Titlul</title>
<style type="text/css">
#idh {
  color:#fe1111;
  text-decoration:overline;
  text-align:center;
}
</style>
</head>
<body>
<h2 id="idh">Text ...</h2>
<h2>Alt text ... </h2>
</body>
</html>

- In acest exemplu, stilul creat pentru "idh" va fi folosit doar pentru elementul "h2" care contine 'id="idh".

- ID-ul e folosit mult si pentru JavaScript, ca sa poata prelua acel element in codul javascript.

Forum

Cand se foloseste class si id

Cand se foloseste class si id