Klasė prieš ID
Cascading Style Sheets (CSS) yra kalba, apibūdinanti dokumento, parašyto naudojant žymėjimo kalbą, išvaizdą ir formatavimą. CSS plačiai naudojamas tinklalapiams, parašytiems HTML, stilizuoti. CSS leidžia ne tik taikyti stilius HTML elementams, bet ir nurodyti savo stiliaus parinkiklius. Tai atliekama naudojant ID ir klasės parinkiklius. Nurodant vieno unikalaus elemento stilių, naudojamas ID parinkiklis. Nurodant stilių elementų grupei, naudojamas klasės parinkiklis.
Kas yra klasė?
CSS klasės parinkiklį galima naudoti norint pritaikyti savo stilių elementų grupei. Klasės parinkiklis naudojamas tam tikram stiliui taikyti elementų rinkiniui su ta pačia klase. CSS sistemoje klasės parinkiklis identifikuojamas tašku (.). Toliau pateikiamas CSS apibrėžto klasės parinkiklio pavyzdys.
.mano_klasė {
spalva: mėlyna;
šrifto svoris: paryškintas;
}
HTML gali nurodyti klasę, apibrėžtą CSS naudojant atributų klasę, kaip parodyta toliau.
Tai mano formatavimas
Tai vėl mano formatavimas
Kaip parodyta aukščiau, ta pati klasė gali būti naudojama keliems elementams, o vienas elementas gali naudoti kelias klases. Kai tame pačiame elemente naudojamos kelios klasės, jos įterpiamos į klasės atributą, atskirtą tarpu, kaip parodyta toliau.
Tai mano formatavimas naudojant dvi klases
Kas yra ID?
CSS ID parinkiklis gali būti naudojamas, norint pritaikyti savo stilių vienam unikaliam elementui. CSS sistemoje ID parinkiklis identifikuojamas pagal maišą (). Toliau pateikiamas CSS apibrėžto ID parinkiklio pavyzdys.
mano_ID {
spalva: raudona;
text-align:right;
}
HTML gali nurodyti ID parinkiklį, apibrėžtą CSS naudojant atributo ID, kaip parodyta toliau.
Tai mano formatavimas iš ID parinkiklio
ID yra unikalūs. Todėl kiekvienas elementas gali turėti tik vieną ID, o kiekvienas puslapis gali turėti tik vieną elementą su tuo konkrečiu ID. ID turi svarbią savybę, kurią galima naudoti su naršykle. Jei puslapio URL yra maišos reikšmė (pvz., https://myweb.commy_id), naršyklė bandys automatiškai rasti elementą su ID „my_id“ir slinks tinklalapiu, kad būtų rodomas šis elementas. Tai yra viena iš priežasčių, kodėl puslapyje turėtų būti vienas elementas su tuo konkrečiu ID, kad naršyklė galėtų rasti tą elementą.
Kuo skiriasi klasė ir ID?
Nors ir klasės parinkiklis, ir ID parinkiklis gali būti naudojami norint pritaikyti savo stilių tinklalapio elementams, jie turi keletą svarbių skirtumų. Klasės parinkiklis gali būti naudojamas norint pritaikyti savo stilių elementų grupei, o ID parinkiklis naudojamas stiliui pritaikyti vienam unikaliam elementui. Naudojant ID, kiekvienas elementas gali turėti tik vieną ID, o kiekviename puslapyje gali būti tik vienas elementas su tuo konkrečiu ID, tačiau klasė gali būti naudojama keliems elementams, o vienas elementas gali naudoti kelias klases. Be to, ID gali būti naudojamas automatiškai slinkti puslapiu, kad būtų rodomas elementas su tuo ID, bet tai neįmanoma naudojant klasės parinkiklį.