hola el tema de class vs Id tiene que ver mucho con la Especificidad, porque el uso de id esta mas orientados para usarlo con JavaScript, por ejemplo (acceder al boton por id para que cambie la clase css)
por ejemplo si tenemos el siguiente codigo
/*usando las clases es la forma mas practica y recomendable de usar*/
.title{
color: red;
}
/*el id tiene mayor valor ante todos sobrescribiendo la clase anterior de ejemplo*/
#title{
color: red;
}
/*en este ejemplo el id #title sobrescribe a la clase totalmente*/
Especificidad "establece como de especifico, es un selector para saber que estilo aplicar"
se recomienda usar siempre clases
etiquetas y pseudoelementos 001
clases, atributos y pseudoclases 010
Ids 100
Estilos en linea 1000
!Important gana a todo
cascada: funciona siempre que la especificidad sobre el elemento sea la misma.
link para saber si se tiene un buen css
https://jonassebastianohlsson.com/specificity-graph/