Ero tunnuksen ja luokan välillä CSS: ssä

Sisällysluettelo:

Mitä ovat CSS -säännöt
Mikä on id
Mikä on luokka
Ero tunnuksen ja luokan välillä CSS: ssä

The tärkein ero id: n ja luokan välillä CSS: ssä on, että id: tä käytetään tyylin käyttämiseen yhdellä ainutlaatuisella elementillä, kun taas luokalla käytetään tyyliä useille elementeille.

Verkkokehityksessä on erilaisia tekniikoita. Suurimmat kielet verkkosivustojen kehittämisessä ovat HTML, CSS ja JavaScript. HTML on lyhenne sanoista Hyper Text Markup Language. Se auttaa kehittämään verkkosivun rakennetta. JavaScript auttaa tekemään verkkosivusta dynaamisemman. CSS tarkoittaa Cascading Style Sheets. Se auttaa lisäämään tyylejä ja tekemään verkkosivuista edustavampia. CSS -säännöt koskevat HTML -elementtejä. Lisäksi CSS -valitsimet auttavat löytämään elementtejä ja soveltamaan vaadittua tyyliä HTML -tunnisteisiin. tunnus ja luokka ovat kahdenlaisia valitsimia.

Luokka, CSS -säännöt, tunnus

Mitä ovat CSS -säännöt

CSS koostuu säännöistä. Selain voi tulkita näitä sääntöjä ja soveltaa niitä asiakirjan määritettyihin elementteihin. CSS -tyylisääntö koostuu kolmesta osasta. Ne ovat valitsin, ominaisuus ja arvo. Ilmoitus viittaa kiinteistön ja arvon yhdistelmään. Ne näkyvät parillisten kiharareunojen sisällä seuraavasti.

valitsin {property: value; }

Valitsin - Auttaa tunnistamaan elementin tyylin soveltamiseksi

Omaisuus - Ominaisuus. Kaikki HTML -määritteet muunnetaan CSS -ominaisuuksiksi. Esimerkkejä ovat väri, tekstin tasaus, reunus jne.

Arvo - Arvo on kiinteistölle määritetty arvo. Esimerkiksi ominaisuuden väri voidaan määrittää siniseksi.

Mikä on id

Ohjelmoija voi määrittää tyylisäännön elementtien tunnuksen perusteella. Kaikki elementit, joilla on sama tunnus, käytetään määritetyllä tyylillä. Jos haluat valita elementin, jolla on tietty tunnus, siinä tulee olla # (tiiviste) -merkki ja sen jälkeen elementin tunnus.

Oletetaan, että HTML -tiedosto sisältää seuraavan lausekkeen.

CSS -tiedosto sisältää seuraavan koodin.

#header1 {

väri: sininen;

}

Kun selain tulkitsee HTML -käskyn, se tarkistaa h1 -elementin tunnuksen, joka on CSS -tiedoston otsikko1. Sitten se soveltaa määritettyä CSS -sääntöä h1 -elementtiin. Siksi teksti Hello World näkyy sinisenä.

Tunnus on ainutlaatuinen sivulla. Siksi id -valitsinta käytetään yhdelle ainutlaatuiselle elementille.

Mikä on luokka

Samoin kuin id, ohjelmoija voi määrittää tyylisäännöt elementin luokan perusteella. Kaikkia saman luokan elementtejä käytetään määritellyllä tyylillä. Tietyn luokan elementin valitsemiseksi on oltava. (piste) -symboli, jota seuraa luokan nimi.

Oletetaan, että HTML -tiedosto sisältää seuraavat lauseet.

CSS -tiedosto sisältää seuraavan koodin.

.header1 {

väri: sininen;

}

Kun selain tulkitsee HTML -käskyn, se tarkistaa h1 -elementin luokan, joka on CSS -tiedoston header1. Sitten se soveltaa määritettyä CSS -sääntöä kaikkiin h1 -elementteihin. Siksi teksti Hello World 1 ja Hello World 2 näkyvät sinisenä.

Samaa luokkaa voidaan käyttää useissa elementeissä. Siksi luokanvalitsinta käytetään useille elementeille.

Ero tunnuksen ja luokan välillä CSS: ssä

Määritelmä

id on CSS: n valitsin, joka muotoilee elementin määritetyllä tunnuksella, kun taas luokka on CSS: n valitsin, joka muotoilee valitut elementit määritetyllä luokalla.

Syntaksi

Id -syntaksi on #id {css deklarations; }. Luokan syntaksi on.class {css deklarations; }

Käyttö

Lisäksi id: n käyttö on tyylin soveltamista yhteen tiettyyn elementtiin. Luokan käyttö on soveltaa tyyliä useisiin elementteihin.

Johtopäätös

Tunnus ja luokka ovat kaksi CSS -valitsinta, jotka mahdollistavat tyylin soveltamisen HTML -elementteihin. Tärkein ero tunnuksen ja luokan välillä CSS: ssä on, että tunnusta käytetään tyylin käyttämiseen yhdessä ainutlaatuisessa elementissä, kun taas luokkaa käytetään tyylin soveltamiseen useisiin elementteihin.