Selettore ID in CSS

Il selettore ID utilizzava gli attributi ID dell'elemento per colpire un particolare elemento. Poiché un documento HTML dovrebbe avere un ID univoco per un elemento, quindi il selettore ID prende di mira un elemento univoco. È molto utile in quegli scenari in cui sono richieste cambiamenti dettagliati. Quando è necessario implementare lo styling su un elemento singolo e specifico, è possibile utilizzare un selettore di ID come ID.

Ad esempio, se devi cambiare il colore del testo di tutti

Elementi quindi è possibile utilizzare il selettore degli elementi. Tuttavia, quando devi colpire un singolo

tag quindi sarà richiesto un selettore più specifico come un Selettore ID.

Sintassi

Il selettore ID è descritto con il segno # seguito dall'ID dell'elemento.

#idname CSS Properties

Regole per implementare il selettore ID

Ci sono alcune regole da seguire per gestire i selettori ID.

La prima regola da seguire mentre si tratta del selettore ID è che deve avere almeno un carattere e non può iniziare con un numero. Per esempio:

All'interno della stessa pagina, più elementi HTML non possono avere lo stesso id:

Se un elemento ha un ID, allora deve essere univoco:

La regola finale è che il Nome ID E costo dell'immobile Deve essere lo stesso:

Ora considera il seguente esempio con lo "stile" ID:

Selettore ID

Benvenuti in Linuxhint.com

Secondo paragrafo

Nello snippet sopra, uno dei

Elements è disegnato secondo lo "stile" dell'ID. Pertanto le proprietà di #style si applicheranno solo su questo

Elemento come mostrato nell'output seguente:

Il selettore ID può essere utilizzato su vari elementi HTML come immagini, paragrafi, intestazioni, ecc.

Specificità CSS

La specificità CSS è un insieme di regole che utilizzano il quale il browser Web determina quale proprietà è più adatta/appropriata a un elemento. In CSS, il selettore ID ha la massima specificità tra tutti gli altri selettori a causa della sua unicità.

Ad esempio, il codice indicato di seguito ha due stili che puntano allo stesso elemento i.e.


<

Selettore ID

Benvenuti in Linuxhint.com

Secondo paragrafo

Poiché lo stile di classe viene dichiarato primo e il paragrafo indica prima lo stile "classe", quindi il browser applicherà lo stile del selettore di classe?

NO! Il browser determinerà la specificità di questi selettori. Poiché il selettore ID ha una specificità maggiore, quindi implementerà le proprietà utilizzando il selettore ID come mostrato nell'output:

Conclusione:

IL Selettore ID CSS Utilizzato l'accesso all'attributo ID per dare lo stile a un elemento HTML specifico. L'unicità rende la priorità del selettore ID rispetto ad altri selettori. Ha la massima specificità rispetto a tutti gli altri selettori. Questo articolo ha fornito una comprensione dettagliata del selettore ID, la sua sintassi, alcune regole che devono essere seguite mentre si tratta di selettori ID e, infine, ha fornito la guida sulla specificità CSS.