Trieda vs ID
Kaskádové štýly (CSS) je jazyk, ktorý popisuje vzhľad a formátovanie dokumentu napísaného pomocou značkovacieho jazyka. CSS sa často používa na úpravu webových stránok napísaných v jazyku HTML. CSS umožňuje okrem použitia štýlov pre prvky HTML určiť aj vlastné selektory štýlov. To sa deje pomocou selektorov ID a tried. Pri zadávaní štýlu pre jeden jedinečný prvok sa používa selektor ID. Pri určovaní štýlu pre skupinu prvkov sa používa selektor triedy.
Čo je to Trieda?
V CSS je možné použiť selektor triedy na použitie vlastného štýlu na skupinu prvkov. Selektor Trieda sa používa na použitie konkrétneho štýlu na množinu prvkov s rovnakou triedou. V CSS je selektor triedy označený bodkou (.). Nasleduje príklad selektora triedy definovaného v CSS.
.moja trieda {
farba: modrá;
váha písma: tučné;
}
HTML môže odkazovať na triedu definovanú v CSS pomocou triedy atribútov, ako je uvedené nižšie.
Toto je moje formátovanie
Toto je opäť moje formátovanie
Ako je uvedené vyššie, rovnakú triedu je možné použiť pre viac prvkov a jeden prvok môže používať viac tried. Ak sa v jednom prvku použije viac tried, triedy sa vložia do atribútu triedy ohraničeného medzerou, ako je uvedené nižšie.
Toto je moje formátovanie pomocou dvoch tried
Čo je to ID?
V CSS možno pomocou selektora ID použiť svoj vlastný štýl na jeden jedinečný prvok. V CSS je selektor ID identifikovaný hashom (#). Nasleduje príklad selektora ID definovaného v CSS.
#my_ID {
farba: červená;
zarovnanie textu: vpravo;
}
HTML môže odkazovať na selektor ID definovaný v CSS pomocou atribútu id, ako je uvedené nižšie.
Toto je môj formátovací formulár pre selektor ID
ID sú jedinečné. Preto môže mať každý prvok iba jedno ID a každá stránka môže mať iba jeden prvok s týmto konkrétnym ID. ID majú dôležitú vlastnosť, ktorú je možné použiť v prehliadači. Ak adresa URL stránky obsahuje hodnotu hash (napr. Http: //myweb.com#my_id), prehliadač sa pokúsi automaticky vyhľadať prvok s ID „my_id“a posúvať webovú stránku, aby sa tento prvok zobrazil. To je jeden dôvod, prečo by stránka mala mať jeden prvok s týmto konkrétnym ID, aby prehliadač mohol tento prvok vyhľadať.
Aký je rozdiel medzi triedou a ID?
Aj keď je možné použiť selektor triedy aj selektor ID na použitie vlastného štýlu na prvky na webovej stránke, majú určité dôležité rozdiely. Pomocou selektora triedy môžete použiť svoj vlastný štýl na skupinu prvkov, zatiaľ čo selektor ID sa používa na použitie štýlu na jeden jedinečný prvok. Pri použití identifikátorov môže mať každý prvok iba jeden identifikátor a každá stránka môže mať iba jeden element s konkrétnym ID, triedu je však možné použiť pre viac prvkov a jeden prvok môže používať viac tried. Ďalej možno ID použiť na automatické rolovanie stránky na zobrazenie prvku s týmto ID, ale to nie je možné pomocou selektora triedy.
