Css class vagy id, id különbségek osztály

Id - egy egyedi azonosítót elem. Az egyik oldalon egy azonosítót csak egyszer használható, de lehet alkalmazni több azonos azonosítóval egyetlen oldalon belül, de ez problémát okozhat, ha a HTML-horgonyok és JS. Ha megpróbálja hozzárendelni az azonos elem (HTML-tag), két különböző azonosító, akkor csak kizárni az első (baloldali) ID

1. példa: vizsgálat nem kívánatos, hogy az azonosító (ID)

A kijelölt szöveg egység

A kijelölt szöveg egység

2. példa: mivel lehetetlen használni az azonosítókat (ID)

Hozzárendelése két vagy több ID-1 dik eleme nem megengedett

Abban az esetben, egyidejű használata ugyanazon elem id és class prioritást ID magasabb lesz, mint az osztály:

Meghatározása CSS stílus

# my_id_r7t # 123; színét. zöld; font-weight. bold; # 125;
.my_class_r7t # 123; színét. kék; font-style. dőlt; # 125;

HTML CSS stílusok

Ez a bekezdés rendelt osztály azonosító és my_class my_id.

Ez a bekezdés rendelt osztály azonosító és my_class my_id.

Mint látható, a szín megszerezte a rögzített értékek az azonosítót. De ha jobban megnézed, az id és class sikeresen kiegészítik egymást: félkövér, meg az azonosító párosul dőlt írt osztályban.

Ha a cél leíró

Még mindig és stílus:

. Az eredmény a következő lesz:

A legmagasabb prioritás a stílus rendelve diskriptoru segítségével style = „”.

Egy jó példa a felsorolt ​​prioritások a hivatalos dokumentáció CSS ​​(eng). Röviden, a prioritások csökkenő sorrendben a következők: a stílus, id, class, stílus tag.

id elemet lehet alkalmazni, mint egy HTML-horgony, ahelyett, hogy a régi dizájn . annak érdekében, hogy képes legyen utal egy bizonyos része az oldal, újraindítás nélkül a popomschyu emeleti . Ha az oldal lesz több azonos id, kétértelmű helyzet áll elő.

Amikor beállítja az oldalakat a JS, gyakran használt funkció getElementById # 40; # 41;. amely szintén „várja”, hogy az azonosító egyedinek kell lennie. Ellenkező esetben eredményezheti a kódon.

Ha egy osztály. Egy HTML-leíró lehet rendelni a stílust a több osztály egyidejűleg:

my_class_r7t # 123; színét. kék; font-style. dőlt; # 125;
.my_class_ffR5 # 123; színét. fekete; background-color. #fafafa; padding. 3px; határon. 1px szilárd # 757575; margin-left. 30px; # 125;

A nevét a különböző osztályok által rögzített tér:

2. alkalmazási példa két különböző osztályokban 1. HTML-tag.

Mi úgy néz ki, nézd meg lentebb:

Az alkalmazásának eredményeként két különböző osztályokban 1. HTML tag.

Osztályok my_class_r7t my_class_ffR5 és különböző színű tartalom HTML-tag. Használt, hogy a szín, hogy határozza meg a stílust fájlt később (ebben az esetben az osztály my_class_ffR5 követően rögzített my_class_r7t). Az eljárás alkalmazása osztályok a HTML-leíró nem számít.

Hozzárendelni egy összetett osztályok egyedi stílus, meg vannak írva nélkül együtt probleov:

my_class_bbbb755 # 123; font-weight. bold; # 125;
.my_class_ffR5 .my_class_bbbb755 # 123; text-align. jog; # 125;

Jobbra igazítás, akkor lehet csak alkalmazni abban az esetben, ha egy HTML-leíró rendelt azonnal 2. osztály:

Alkalmazási példa stílusok vegyület osztályok

Mi úgy néz ki, nézd meg lentebb:

Alkalmazási példa stílusok vegyület osztályok

Az azonos osztályba tartozó, ellentétben az id, akkor könnyen hozzá nem korlátozott száma a különböző elemek: