CSS селектори
Од Википедија, слободната енциклопедија
CSS-селектори се збир од правила кои помагаат во одбирањето на одреден елемент или ознака во некој HTML-документ.
Список на CSS 2.1 селектори[1] [уреди]
| Селектор | Тип на селектор | Опис |
|---|---|---|
| * | Универзален селектор | Одговара на сите елементи* {font-family:serif;} |
| A | Селектор на типот на елемнтот | Одговара на името на елементотdiv {font-style:italic;} |
| A, B | Групирани селектори | Одговара на елементите A и Bh1,h2,h3 {color:blue;} |
| A B | Селектор на потомокот | Одговара на елементот B само ако B e потомок на Ablockquote 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;} |
Наводи [уреди]
- ↑ Learn Web Design - Jennifer Niederst Robbins ISBN 978-86-7555-334-2