Classes em HTML

Uma atributo de classe especifica características de um elemento HTML. Uma classe pode ser usada por um CSS ou Javascript (através o Document Object Model, or DOM) para realizar determinadas tarefas ou atributos em um elemento com esta classe.

Usando a Classe para ser controlada por CSS

O atributo class pode ser usado em qualquer elemento HTML. O atributo da class é case-sensitive, ou seja, varia também de acordo com letras maiúsculas e minúsculas.

Veja o exemplo abaixo:

<style>
.timesFutebol{
    background-color: tomato;
    color: white;
    padding: 10px;
}
</style>

<h2 class="timesFutebol">Flamengo</h2>
<h2 class="timesFutebol">Corinthias</h2>


Usando a classe para ser acessada por JavaScript

JavaScript pode acessar elementos ao utilizar o método getElementsByClassName().  Veja o exemplo abaixo:

<script>
function myFunction() {
  var x = document.getElementsByClassName("timeFutebol");
  for (var i = 0; i < x.length; i++) {
    x[i].style.display = "none";
  }
}
</script>