Cum să utilizați selectorul de identificare în CSS

Mai 7, 2024

În ultimele câteva tutoriale, am discutat două din cele trei tipuri de reguli CSS. Primul tip este selectorul HTML pe care se bazează și controlează stilul pentru eticheta HTML potrivită. Al doilea tip este selectorul de clase care funcționează ca un stil generic care poate fi aplicat oricărui element de pe pagina web.

Acum este timpul să discutăm al treilea tip de regulă CSS care se numește selector ID. Ca și în cazul selectorului de clasă, selectorul ID poate fi aplicat oricărui element de pe pagina web. Cu toate acestea, este menit să fie utilizat o singură dată pe o pagină. Acest lucru face ca selectorul de identificare să fie foarte util pentru HTML dinamic și JavaScript. Teoretic, dacă utilizați selectorul de identitate de mai multe ori pe o pagină, cele ulterioare ar trebui ignorate de browserul web. Totuși, acest lucru nu este întotdeauna cazul. Este foarte dificil să te bazezi pe predictibilitatea browserelor web. Prin urmare, atunci când alegeți să utilizați selectorul de identificare, aveți grijă să îl utilizați o singură dată. Să aruncăm o privire la un exemplu.

Cod de bază

. . .

Exemplu

. . .

ID-Selector

În interiorul etichetelor, veți observa că selectorul ID începe cu simbolul hash (#) și că este urmat cu numele pe care îl atribuiți selectorului ID. Ca și în cazul selectorului de clase, puteți utiliza orice nume doriți, dar cel mai bine este dacă numele indică pentru ce va fi folosit selectorul de ID. În exemplu, îl utilizăm pentru a identifica o secțiune specială a textului.

{Valoarea proprietății;}

De asemenea, în interiorul etichetelor, selectorul ID este urmat de una sau mai multe perechi de proprietăți-valori care sunt plasate între paranteze cretate. Aceste perechi proprietate-valoare setează caracteristicile stilului. În exemplu, paragraful cu selecția ID special_text va avea text colorat în roșu.

. . .

Când utilizați selectorul ID în corpul paginii web, veți utiliza atributul ID din eticheta HTML de deschidere. Valoarea atributului ID este numele unic dat selecționerului ID, în acest caz "special_text". (id = "valoare") Acesta este modul în care selectorul „conectează” stilul la acea etichetă HTML la care doriți să aplicați stilul. În exemplul de mai sus, selectorul de identificare va fi plasat în interiorul unuia

etichetă pe pagina web. Orice alte etichete HTML de pe pagina web nu ar trebui să conțină selectorul ID în eticheta de deschidere.

Instrucțiuni Video,: CSS Tutorial — Selectors, Element, Class and ID (3/13) (Mai 2024).

Cum să utilizați selectorul ID în CSS, HTML, tipuri de reguli CSS, cum să utilizați selectorul ID, selectorul ID CSS

Articolul Precedent

Articolul Următor

Articole Similare

calculatoare

Comanda de configurare a paginilor Word

Mai 2024

MS Word oferă utilizatorilor flexibilitate în aranjarea modului în care pagina de document este vizualizată și tipărită. Cu excepția cazului în care executați comanda Setare pagină, pagina...

calculatoare

Fundația Flash CS3 pentru designeri - Recenzie de carte

Mai 2024

Abordarea adoptată de Tom Green și David Stiller în această carte este de a învăța FlashR CS3 din punctul de vedere al proiectantului. Cu toate acestea, Flash CS3 este un instrument puternic și este...