Избор на елемент по уникален id в CSS
Както вече знаете, класовете са предназначени,
да се присвояват на група от елементи. Освен
класове, може също да се избират елементи по
id, представляващ уникален
идентификатор на елемента. Под уникалност
се разбира, че ако на страницата
вече има елемент с такъв id, то друг
елемент със същия id не трябва да съществува.
Уникалният идентификатор се задава чрез
атрибута id, в който се пише измислено
от нас име. Нека, например, направим два
блока. На първия зададем id със стойност
block1, а на втория - със стойност
block2:
<div id="block1">
<p>text</p>
<p>text</p>
</div>
<div id="block2">
<p>text</p>
<p>text</p>
</div>
За да се обърнем към елемент с зададен id,
трябва да се напише символът # и измисленото
от нас име, ето така:
#block1 {
color: red;
}
#block2 {
color: green;
}
Атрибутът id се използва в случай,
когато е необходимо да се подчертае уникалността
на елемента. Класовете се използват тогава, когато
се предполага, че такива елементи може
да има много, дори ако в момента има само един.
Даден е следният код:
<div id="elem1">
<h2>Title</h2>
<p>
text
</p>
<p>
text
</p>
</div>
<div id="elem2">
<h2>Title</h2>
<p>
text
</p>
<p>
text
</p>
</div>
<div id="elem3">
<h2>Title</h2>
<p>
text
</p>
<p>
text
</p>
</div>
Оцветете съдържанието на блока elem1 в
червен цвят, на блока elem2 - в зелен,
а на блока elem3 - в синкавозелен.