HTML osztályok olyan címkék, amelyeket a HTML dokumentumokban használhatunk a különböző elemek megjelölésére és stílusának meghatározására.
Az osztályokat a HTML elemeknek adhatjuk meg az class attribútum segítségével. Például:
<p class="intro">Ez egy bevezető szöveg.</p>
<p class="warning">Figyelem: ez egy figyelmeztető szöveg.</p>
Ezekben az elemekben az intro és a warning osztályokat használtuk.
Az osztályokat a CSS használatával stílusosíthatjuk. Például az intro osztályhoz tartozó elemek szövegét kék színűre állíthatjuk a következő CSS segítségével:
.intro {
color: blue;
}
Az osztályokat több elemre is felhasználhatjuk, és több osztályt is hozzáadhatunk egy elemhez. Például:
<p class="intro important">Ez egy fontos bevezető szöveg.</p>
Itt az important osztály is hozzáadásra került az intro osztályhoz. A CSS-ben a kettős osztályokat így írhatjuk le:
.intro.important {
font-weight: bold;
}
Ezzel az elemek, amelyekben az intro és az important osztályok is megtalálhatók, a szövegüket is dőlt betűtípussal jelenítjük meg.
Az osztályok használatával könnyen szervezhetővé tehetjük a HTML dokumentumunkat, és egyszerűen megváltoztathatjuk az elemek megjelenését a CSS segítségével.