Метод css

Метод css омогућава читање и мењање CSS стилова елемента. Важно је запамтити да ћемо добијати 'израчунате вредности' својстава (computed style properties), које се могу разликовати од наведених у css стиловима.

Синтакса

Добити једно својство:

javascript$(селектор).css(својство);

Добити више својстава, параметар који се прослеђује је низ имена својстава:

javascript$(селектор).css(['width', 'height', 'color']);

Променити једно својство:

javascript$(селектор).css(својство, нова вредност);

Променимо више својстава, прослеђујући их као објекат који садржи парове 'кључ: вредност'. Назив својства се наводи у облику CamelCase:

javascript$(селектор).css({fontSize: '12px', color: 'red'});

Или, алтернативни начин:

html<p class="www">text</p>
javascript$('.www').css({'font-size':'12px', 'color':'red'});

Такође можемо применити задату функцију на сваки елемент у скупу. При томе ће први параметар функције добити редни број елемента у скупу, а други параметар - тренутну вредност задатог css својства за конкретни елемент. При томе ће this унутар функције показивати на тренутни елемент. CSS својство сваког елемента ће се променити у оно које функција врати конкретно за тај елемент:

javascript$(селектор).css(име својства, function(редни број у скупу, тренутна вредност css својства));

Пример

Хајде да добијемо све елементе са класом www и променимо њихову боју у црвену:

html<p class="www">text</p>
javascript$('.www').css('color', 'red');

Пример

Хајде да добијемо све елементе са класом www и променимо њихову боју у црвену, а величину фонта - на 20px:

html<p class="www">text</p>
javascript$('.www').css({color:'red', fontSize:'20px'});

Или, алтернативни начин:

html<p class="www">text</p>
javascript$('.www').css({'color':'red', 'font-size':'20px'});

Погледајте такође

  • метод width,
    који омогућава читање и мењање ширине елемента
  • метод offset,
    који омогућава читање тренутних координата елемента