I selettori di ID e di classe esistono fin dall'inizio della storia dei CSS. Sono i selettori più usati in assoluto ma nonostante questo la buona pratica di utilizzare prefissi coerenti stenta ancora a prendere piede.
Consideriamo questo codice CSS, diviso in due sezioni:
/* Senza prefisso */
.danger { ... }
.info { ... }
.success { ... }
/* Con prefisso */
.my-danger { ... }
.my-info { ... }
.my-success { ... }
Le classi con prefisso appaiono raggruppate sotto lo stesso comune namespace. Ma i vantaggi sono ancora più evidenti se pensiamo alle possibilità offerte dai selettori CSS3:
html.debug-mode *[class^="my-"] {
outline: 1px solid red;
}
In pratica ora possiamo aggiungere stili collettivi a tutti gli elementi che condividono lo stesso prefisso e questo si rivela molto utile in svariati contesti. Non dobbiamo più elencare tutti i selettori, ma possiamo indirizzare direttamente i nostri stili.