[jQuery] 제이쿼리 css

jquery .css()

.css()은 요소의 css 속성을 바꾸는 기능을 수행하는 매소드입니다.  

사용법 1 하나의 속성 수정할 때

//요소를 고르고 css('속성 이름','바꿀 값')
$(요소).css('color','red');

 

사용법 2 여러 개의 속성을 수정할 때

//요소를 고르고 css({'속성 이름':'바꿀 값'},{'속성 이름':'바꿀 값'}); 
//하나의 요소를 바꿀 때에도 사용가능하다
$(요소).css({'color':'red'});

$(요소).css({'color':'red'},{'font-size':'20px'});

$(요소).css({'color':'red'},{'font-size':'20px'},{'width':'100%'});

 

 

제이쿼리 .css()는 혼자 사용하지 않고

특수한 조건일 때  css의 속성을 바꿀 때 사용한다. 

 

클릭했을 때(click), 마우스를 올렸을 때(hover), 스크롤을 내렸을 때(scroll.top) 등등 조건과 함께 사용한다.

 

 주의사항

제이쿼리 .css() 에는 !important 속성을 줄 수 없다. 

!important를 사용하려면 .attr() 속성을 이용하여 줄 수 있다.

.attr('style','color : red !important'); 이런 식으로 사용해야 된다. 

//적용이 안됨
$(요소).css({'color':'red !important'});

//올바른 예
$(요소).attr('style','color : red !important');