2.4.1 Блокова модель. Селектори класу та ідентифікатори

Селектори class та id

Якщо для однакових елементів потрібна різна стилізація, то використовують класи або ідентифікатори

Відмінність між селекторами "id" і "class"

• 1. id-унікальне власне ім'я елемента на сторінці. На сторінці має лише один елемент з цим id. Наприклад блоку з шапкою сайту можна дати id = "title", іншим блокам це ім'я не можна присвоїти.

  2. class -вільна ознака, що дається зазвичай до кількох елементів. Наприклад, на сторінці може бути кілька картинок оформлених однаково в стилі class = "decor".

  3. Різний пріоритет. У кожного правила в CSS є "вага", за яким визначається порядок їх застосувань. У id ця вага більше. Тому, якщо у елемента заданий і id, і class, виграє id.

  4. Якірні посилання. Якщо потрібно поставити посилання на якийсь елемент на сторінці, то йому достатньо дати id (<h2 id = "mitka1"> ... </ h2>) і посилатися на нього якорем http://site/path/#mitka1).

  5. Множинні ознаки. Елементу можна задавати декілька класів через пробіли: <img class = "important centered printable">. Причому їх можна описати і окремо .important {color: red;}... і в поєднанні:.important.centered {border: solid black 1px;}