| Селектор |
Тип на селектор |
Опис
|
| * |
Универзален селектор |
Одговара на сите елементи
* {font-family:serif;}
|
| A |
Селектор на типот на елемнтот |
Одговара на името на елементот
div {font-style:italic;}
|
| A, B |
Групирани селектори |
Одговара на елементите A и B
h1,h2,h3 {color:blue;}
|
| A B |
Селектор на потомокот |
Одговара на елементот B само ако B e потомок на A
blockquote em {color:red;}
|
| A>B |
Селектор на дете |
Одговара на секој елемент B кој е дете на елементот А
div.main>p {line-height: 1.5;}
|
| A+B |
Селектор на брат |
Одговара на секој елемент B кој е непосредно по било кој елемент А
p+ul {margin-top:0;}
|
.classname
A.classname |
Селектор на класа |
Одговара на вредностите на атрибутите на класата во сите елементи или во наведениот елемент
p.credits {font-size: 80%;}
|
#idname
A#idname |
Селектор на идентификатор |
Одговара на вредноста на атрибутот „id“ во елементот
#intro {font-weight:bold;}
|
| A[att] |
Селектор на атрибут |
Одговара на секој елемент A со дефиниран атрибут „att“ без разлика на неговата вредност
table[border] {background: white;}
|
| A[att="val"] |
Специјален селектор на атрибут |
Одговара на секој елемент А на кој вредноста на атрибутот „att“ е „val“
table[border="3"] {background="yellow";}
|
| A[att~="val"] |
Специјален селектор на атрибут |
Одговара на секој елемент А на кој вредноста на атрибутот „аtt“ е слична на „val“
table[class="primer"] {background="yellow";}
|
| A[att|="val"] |
Специјален селектор на атрибут |
Одговара на секој елемент А на кој вредноста на атрибутот „att“ почнува или е еднаква на „val“
<a[lang|="mk"] {background-image: url(mk_icon.png);}
|
| A:link |
Селектор на псевдокласа |
Го дефинира стилот на сите непосетни врски во елементот А
a:link {color:blue;}
|
| A:visited |
Селектор на псевдокласа |
Го дефинира стилот на сите посетени врски во елементот А
a:visited {color:red;}
|
| A:active |
Селектор на псевдокласа |
Го дефинира стилот на елементот А кога тој е активен (корисникот кликнува на него)
a:active {margin-top:-2px;}
|
| A:focus |
Селектор на псевдокласа |
Го дефинира стилот на елементот А кога тој е фокусиран
a:focus {color:blue;}
|
| A:lang (xx) |
Селектор на псевдокласа |
Го дефинира стилот на елементот на А кој одговара на ознаката на јазикот (две букви)
a:lang(mk) {color:green;}
|
| A:first-child |
Селектор на псевдокласа |
Го дефинира стилот на првото дете на елементот А во нормалниот тек на документот
p:first-child {line-height: 2em;}
|
| A:first-letter |
Селектор на псевдоелемент |
Го дефинира стилот на првата буква во елементот А
p:first-letter {font-size:4 em;}
|
| А:first-line |
Селектор на псевдоелемент |
Го дефинира стилот на првиот ред на елементот на А
p:first-line {background-color:green;}
|
| А:before |
Селектор на псевдоелемент |
Го вметнува текстот на почетокот на елементот А и го дефинира неговиот стил
p.intro:before {content:"почни од овде"; color:gray;}
|
| А:after |
Селектор на псевдоелемент |
Го вметнува текстот на карјот на елементот А и го дефинира неговиот стил
p.intro:after {content:"заврши овде"; color:gray;}
|
