Kuinka käyttää ID-valitsinta CSS: ssä

Saattaa 18, 2024

Muutamissa viimeisissä opetusohjelmissa keskustelimme kahdesta kolmesta CSS-säännön tyypistä. Ensimmäinen tyyppi on HTML-valitsin, joka perustuu vastaavan HTML-tunnisteen tyyliin ja hallitsee sitä. Toinen tyyppi on luokanvalitsin, joka toimii kuin yleinen tyyli, jota voidaan käyttää mihin tahansa verkkosivun elementtiin.

Nyt on aika keskustella kolmannesta CSS-säännön tyypistä, jota kutsutaan ID-valitsijaksi. Kuten luokkavalitsimella, ID-valitsinta voidaan käyttää mihin tahansa verkkosivun elementtiin. Se on kuitenkin tarkoitettu käytettäväksi vain kerran sivulla. Tämä tekee ID-valitsimesta erittäin hyödyllisen dynaamisessa HTML: ssä ja JavaScriptissä. Teoreettisesti, jos käytät ID-valitsinta useammin kuin kerran sivulla, selaimen tulisi sivuuttaa seuraavat valinnat. Näin ei kuitenkaan aina ole. Selainten ennustettavuuteen on erittäin vaikea luottaa. Siksi, kun valitset ID-valitsimen, käytä sitä vain kerran. Katsotaanpa esimerkkiä.

Peruskoodi

. . .

esimerkki

. . .

ID-valitsin

Tunnisteiden sisällä huomaat, että ID-valitsin alkaa hash-symbolilla (#) ja sitä seuraa tunnuksella, jonka valitsit ID-valitsimelle. Kuten luokanvalitsimessa, voit käyttää mitä tahansa haluamaasi nimeä, mutta on parasta, jos nimi osoittaa, mihin ID-valitsinta käytetään. Esimerkissä käytämme sitä erityisen tekstiosan tunnistamiseen.

{omaisuuden arvo;}

Tunnisteiden sisällä ID-valitsinta seuraa myös yksi tai useampi ominaisuus-arvopaari, jotka on sijoitettu kiharaan kiinnikkeiden väliin. Nämä kiinteistö-arvo-parit asettavat tyylin ominaisuudet. Esimerkissä kappaleella, jolla on special_text ID -valitsin, on punainen teksti.

. . .

Kun käytät ID-valitsinta verkkosivun rungossa, käytät id-määrittettä avautuvassa HTML-tunnisteessa. ID-määritteen arvo on ID-valitsimelle annettu yksilöivä nimi, tässä tapauksessa "special_text". (id = "arvo") Näin valitsin “yhdistää” tyylin siihen HTML-tunnisteeseen, johon haluat käyttää tyyliä. Yllä olevassa esimerkissä ID-valitsin asetetaan vain yhden sisään

tag verkkosivulla. Kaikissa muissa verkkosivun HTML-tunnisteissa ei tulisi olla tunnistimen valitsinta avaustunnisteen sisällä.

Video-Ohjeita: JavaScript for Web Apps, by Tomas Reimers and Mike Rizzo (Saattaa 2024).

Kuinka käyttää ID-valitsinta CSS: ssä, HTML: ssä, CSS-sääntöjen tyypeissä, miten käyttää ID-valitsinta ja CSS-ID-valitsinta

Edellinen Artikkeli

Seuraava Artikkeli

Aiheeseen Liittyviä Artikkeleita

tietokoneet

Naruto Ultimate Ninja

Saattaa 2024

Naruto aloitti mangasarjana, josta tuli sitten anime - ja nyt se on Playstation 2 -taistelupeli. Grafiikat ovat melko vaikuttavia! Kuten useimmissa taistelupeleissä, aloitat vain muutamalla merkillä...

tietokoneet

Ilmaiset Microsoftin lataukset

Saattaa 2024

Microsoft tarjoaa ladattavan valtavan kokoelman ilmaisia ohjelmistoja. Kassalle luettelo toimivimmista ja ilmaisimmin ladattavista ohjelmista työpöydällesi. 1.MS Windows Defender 2.MS Windows Live...