https://developer.mozilla.org/en-US/docs/Web/CSS/:hover
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference
În CSS, o clasă și un ID sunt două metode diferite de a selecta elemente HTML și de a le aplica stiluri. În timp ce o clasă poate fi aplicată la mai multe elemente, un ID este unic și poate fi aplicat doar la un singur element.
Clasele sunt utile atunci când doriți să aplicați aceleași stiluri la mai multe elemente HTML. De exemplu, puteți crea o clasă numită "buton" și aplica stiluri pentru aceasta în fișierul CSS. Acest stil va fi aplicat la orice element care are clasa "buton".
Pe de altă parte, ID-urile sunt utile atunci când doriți să aplicați stiluri unice la un element HTML specific. Adesea, ID-urile sunt folosite pentru a defini stiluri pentru elemente precum anteturi, subsoluri și alte elemente care apar într-un singur exemplu pe o pagină.
Exemplu de utilizare a claselor și ID-urilor în CSS:
<html>
<head>
<style>
.buton {
background-color: blue;
color: white;
padding: 10px;
border-radius: 5px;
}
#antet {
font-size: 24px;
font-weight: bold;
}
</style>
</head>
<body>
<h1 id="antet">Bine ați venit!</h1>
<p>Acesta este un paragraf cu o <a href="#" class="buton">buton</a>.</p>
<p>Acesta este un alt paragraf cu o altă <a href="#" class="buton">buton</a>.</p>
</body>
</html>
În acest exemplu, "buton" este o clasă care este aplicată la două elemente <a>
diferite în două paragrafe diferite. Între timp, "antet" este un ID care este aplicat la un element <h1>
.
În general, este recomandat să utilizați clase pentru stiluri comune și ID-uri pentru stiluri unice. Este important de reținut că, deoarece ID-urile sunt unice, ar trebui să fie utilizate cu moderație pentru a evita conflictele de stil.