Come utilizzare il selettore ID nei CSS

Potrebbe 2, 2024

Negli ultimi tutorial abbiamo discusso due dei tre tipi di regole CSS. Il primo tipo è il selettore HTML che si basa e controlla lo stile per il tag HTML corrispondente. Il secondo tipo è il selettore di classe che funziona come uno stile generico che può essere applicato a qualsiasi elemento della pagina Web.

Ora è il momento di discutere il terzo tipo di regola CSS che si chiama selettore ID. Come per il selettore di classe, il selettore ID può essere applicato a qualsiasi elemento della pagina Web. Tuttavia, è pensato per essere usato solo una volta su una pagina. Ciò rende il selettore ID molto utile per HTML e JavaScript dinamici. In teoria, se si utilizza il selettore ID più di una volta su una pagina, i browser successivi dovrebbero essere ignorati. Tuttavia, questo non è sempre il caso. È molto difficile fare affidamento sulla prevedibilità dei browser Web. Pertanto, quando si sceglie di utilizzare il selettore ID, fare attenzione a utilizzarlo solo una volta. Diamo un'occhiata a un esempio.

Codice di base

. . .

Esempio

. . .

Selettore ID

All'interno dei tag, noterai che il selettore ID inizia con il simbolo hash (#) e che è seguito dal nome assegnato al selettore ID. Come con il selettore di classe, è possibile utilizzare qualsiasi nome desiderato, ma è meglio se il nome indica a cosa servirà il selettore ID. Nell'esempio, lo stiamo usando per identificare una sezione speciale di testo.

{valore della proprietà;}

Sempre all'interno dei tag, il selettore ID è seguito da una o più coppie proprietà-valore posizionate tra parentesi graffe. Queste coppie proprietà-valore impostano le caratteristiche dello stile. Nell'esempio, il paragrafo con il selettore ID special_text avrà un testo di colore rosso.

. . .

Quando si utilizza il selettore ID nel corpo della pagina Web, verrà utilizzato l'attributo id all'interno del tag HTML di apertura. Il valore per l'attributo id è il nome univoco assegnato al selettore ID, in questo caso "special_text". (id = "value") Ecco come il selettore “collega” lo stile a quell'unico tag HTML a cui desideri applicare lo stile. Nell'esempio sopra, il selettore ID verrà inserito in uno solo

tag sulla pagina web. Eventuali altri tag HTML sulla pagina Web non devono contenere il selettore ID all'interno del tag di apertura.

Istruzioni Video: CSS3 Avanzato - 2.1 - CSS Reset (Potrebbe 2024).

Come utilizzare il selettore ID in CSS, HTML, tipi di regole CSS, come utilizzare il selettore ID, il selettore ID CSS

Articolo Precedente

Articolo Successivo

La costante PHP

Potrebbe 2024

La costante PHP è molto simile a una variabile PHP in quanto viene utilizzata per memorizzare un valore ma, a differenza di una variabile, il valore non può essere modificato. Si chiama costante...

computer

Nero ~ Una recensione del libro

Potrebbe 2024

NERO Livello di lettura: adulto Copertina rigida: 432 pagine Editore: Thomas Nelson; 2 Anv Edition (luglio 2009) ISBN-10: 1595547304 ISBN-13: 978-1595547309 Oggetto: Un'epica ricca di adrenalina...