Seletores de classe são uma parte fundamental do CSS, permitindo que desenvolvedores direcionem múltiplos elementos com o mesmo atributo de classe e apliquem estilização consistente. Isso os torna altamente versáteis e eficientes para aplicar estilos em todo o site. Seletores de classe são definidos por um ponto (.) seguido do nome da classe. Eles podem ser aplicados a qualquer elemento no documento HTML. Aqui está um exemplo usando um seletor de classe:

<link rel="stylesheet" href="styles.css">
<p class="highlight">Example paragraph</p>

.highlight {
  color: green;
}

Neste exemplo, qualquer elemento com a classe highlight terá a cor do texto definida como green. Seletores de classe têm uma especificidade maior do que seletores de tipo mas menor do que seletores de ID e estilos inline. O valor de especificidade para um seletor de classe é (0, 0, 1, 0). Isso significa que seletores de classe podem substituir seletores de tipo, mas eles podem ser substituídos por seletores de ID e estilos inline. Seletores de classe podem ser combinados com outros seletores para criar regras mais específicas. Aqui está um exemplo combinando um seletor de tipo parágrafo com um seletor de classe:

<link rel="stylesheet" href="styles.css">

<p class="bold-text">Example paragraph</p>
<p class="bold-text">Example paragraph</p>
<p>Another paragraph</p>
<p>Yet another paragraph</p>

p.bold-text {
  font-weight: bold;
}

Esta regra se aplica apenas aos elementos p que também possuem a classe bold-text, tornando seu texto em negrito.