Hur man använder ID-väljaren i CSS

Maj 16, 2024

I de senaste handledningarna diskuterade vi två av de tre typerna av CSS-regler. Den första typen är HTML-väljaren som är baserad på och styr stilen för den matchande HTML-taggen. Den andra typen är klassväljaren som fungerar som en generisk stil som kan tillämpas på alla element på webbsidan.

Nu är det dags att diskutera den tredje typen av CSS-regel som kallas ID-väljaren. Liksom med klassväljaren kan ID-väljaren tillämpas på valfritt element på webbsidan. Men det är tänkt att användas endast en gång på en sida. Detta gör ID-väljaren mycket användbar för dynamisk HTML och JavaScript. Teoretiskt, om du använder ID-väljaren mer än en gång på en sida, bör de efterföljande ignoreras av webbläsaren. Detta är dock inte alltid fallet. Det är mycket svårt att förlita sig på webbläsarnas förutsägbarhet. Därför, när du väljer att använda ID-väljaren, var noga med att använda den bara en gång. Låt oss ta en titt på ett exempel.

Grundläggande kod

. . .

Exempel

. . .

ID-väljare

Inuti taggarna kommer du att märka att ID-väljaren börjar med hash-symbolen (#) och som följs med namnet du tilldelar ID-väljaren. Som med klassväljaren kan du använda valfritt namn men det är bäst om namnet indikerar vad ID-väljaren kommer att användas för. I exemplet använder vi det för att ID: n en speciell textavsnitt.

{fastighetsvärde;}

Även inuti taggarna följs ID-väljaren av ett eller flera egendomsvärdespar som placeras mellan lockiga parenteser. Dessa egendomsvärden anger stilens egenskaper. I exemplet har stycket med specialväljaren ID-text rödfärgad text.

. . .

När du använder ID-väljaren i webbsidan kommer du att använda ID-attributet i den öppnande HTML-taggen. Värdet för id-attributet är det unika namnet som ges till ID-väljaren, i detta fall "special_text". (id = "värde") Så här väljer väljaren stilen till den HTML-taggen som du vill använda stilen på. I exemplet ovan kommer ID-väljaren att placeras endast i en

tagg på webbsidan. Alla andra HTML-taggar på webbsidan ska inte innehålla ID-väljaren i öppningstaggen.

Video Instruktioner: CSS not found on new Power BI web connector? ????- Download 28 (Maj 2024).

Hur man använder ID-väljaren i CSS, HTML, typer av CSS-regler, hur man använder ID-väljaren, CSS-ID-väljaren

Tidigare Artikel

Nästa Artikel

Relaterade Artiklar

datorer

Rita en solbrast i Illustrator CS4

Maj 2024

Om du inte har märkt explosionen av bloggning på webben, är du i minoritet. Som webbdesigner är detta en annan väg att designa för dina kunder. När en klient kommer till mig med en begäran om...

datorer

Fitness - Nintendo Wii Sports

Maj 2024

Fitnessdelen av Nintendo Wii-sportpaket är på samma sätt som Brain Age för din hjärna på DS. Det spårar din hälsa framsteg över tid. Det är verkligen snyggt att tänka att ett videospel hjälper dig...