Atributul HTML class. Utilizarea atributului class. Utilizarea atributului class în elementele inline.

Atributul HTML class

Utilizarea atributului class

Atributul HTML class este folosit pentru a defini stiluri egale pentru elemente cu același nume de clasă.
Deci, toate elementele HTML cu același atribut de clasă (class) vor obține același stil.
Aici avem trei elemente <div> care indică același nume de clasă:

Exemplu:

<!DOCTYPE html>
<html>
<head>
<style>
.cities {
  background-color: black;
  color: white;
  margin: 20px;
  padding: 20px;
}
</style>
</head>
<body>

<div class="cities">
  <h2>Londra</h2>
  <p>Londra este capitala Angliei. </p>
</div>

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

<div class="cities">
  <h2>Tokyo</h2>
  <p>Tokyo Paris este capitala Japoniei.</p>
</div>

</body>
</html>

Rezultat:

Utilizarea atributului class în elementele inline

Atributul HTML class poate fi folosit și pe elementele inline:

Exemplu:

<!DOCTYPE html>
<html>
<head>
<style>
span.note {
  font-size: 120%;
  color: red;
}
</style>
</head>
<body>

<h1>My <span class="note">Important</span> Titlu</h1>
<p>Acesta este un text <span class="note">important</span> text.</p>

</body>
</html>