Tipo - Trucchi CSS | CSS Almanac 2025

Un selettore del tipo (a volte indicato come selettore del tipo di elemento) corrisponde agli elementi con il nome del nodo dell'elemento corrispondente, ad esempio

, e tag. I selettori di tipo vengono generalmente utilizzati per apportare modifiche "a tratto ampio" allo stile di un sito.

p ( /* "p" is the type selector */ margin: 0 0 1em 0; )

Uso comune

Spesso i selettori di tipo sono impostati come predefiniti, come in un ripristino CSS in cui l'intenzione è di sovrascrivere i valori predefiniti del browser. Un esempio dalla prima riga di normalize.css, un popolare reset CSS:

article, aside, details, figcaption, figure, footer, header, main, nav, section, summary ( display: block; )

I selettori di tipo sopra impostano la proprietà di visualizzazione di quei tag su blocco, in modo che ogni volta che uno qualsiasi di questi tag viene utilizzato in tutto il sito verrà visualizzato come blocco a meno che non venga sovrascritto da uno stile più specifico.

Migliori pratiche

È generalmente considerato una cattiva pratica applicare modifiche minime ai dettagli con un selettore di tipo da solo. Ad esempio, l'applicazione di una proprietà "color: white" in modo globale a tutti i tag sarebbe raramente utile su qualsiasi sito. Questo perché i tag sono generici e vengono utilizzati in tutti i siti per vari scopi.

Tuttavia, con un selettore di tipo come l' body ( )impostazione predefinita font-size ed line-heightè comune. Ciò è dovuto in parte al fatto che può esserci un solo tag su una determinata pagina, quindi ci sono meno opportunità di conflitto.

Specifità e prestazioni del selettore di tipo

I selettori di tipo si trovano al livello più basso della cascata di specificità (generalmente scritti come 0, 0, 0, 1), il che significa che quasi tutto sovrascriverà lo stile applicato tramite un selettore di tipo da solo e aggiungendo un selettore di tipo a una classe o ID in il tuo CSS fornisce una minima specificità extra.

I selettori di tipo si classificano anche più in basso nella scala di efficienza CSS rispetto alle classi e agli ID. Pertanto è tecnicamente migliore la scelta delle prestazioni di utilizzare una classe o un ID piuttosto che il selettore di tipo più generico (sebbene la differenza di velocità reale sia in genere trascurabile).