Atributul HTML id. Diferența dintre class și id. Marcaje cu id și link-uri.

Susține Lectii-Virtuale!

Diferența dintre class și id

Un element HTML poate avea un singur id unic care aparține acelui element singular, în timp ce un nume de clasă poate fi utilizat de mai multe elemente:

Exemplu:

<style>
/* Stilează elementul cu id-ul "myHeader" */
#myHeader {
  background-color: lightblue;
  color: black;
  padding: 40px;
  text-align: center;
}

/* Stilează toate elementele cu numele clasei "city" */
.city {
  background-color: tomato;
  color: white;
  padding: 10px;
}
</style>

<!-- Un element unic  -->
<h1 id="myHeader">Orașele mele</h1>

<!-- Mai multe elemente similare -->
<h2 class="city">Londra</h2>
<p>Londra este capitala Angliei.</p>

<h2 class="city">Paris</h2>
<p>Paris este capitala Franței.</p>

<h2 class="city">Tokyo</h2>
<p>Tokyo este capitala Japoniei.</p>

Marcaje (bookmarks) cu id și link-uri

Marcajele (bookmarks) HTML sunt utilizate pentru a permite cititorilor să sară la anumite părți ale unei pagini Web.
Marcajele (bookmarks) pot fi utile dacă pagina dvs. web este foarte lungă.
Pentru a crea un marcaj (bookmark), trebuie mai întâi să creați marcajul, apoi să adăugați un link la acesta.
Când faceți click pe link, pagina va defila cu marcajul (bookmark) la locație.
 
Exemplu:

Mai întâi, creați un marcaj cu atributul id:

<h2 id="C4">Capitolul 4</h2>

Apoi, adăugați un link către marcaj („Salt la capitolul 4”), din interiorul aceleiași pagini:

Exemplu:

<a href="#C4">Salt la capitolul 4</a>

Sau adăugați un link către marcaj ("Salt la capitolul 4"), de pe o altă pagină:

Exemplu:

<a href="html_demo.html#C4">Salt la capitolul 4</a>