[jQuery] .css()

안녕하세요. 경제적, 시간적 자유를 꿈꾸는 한량입니다.

jQuery의 .css() 사용법

jQuery의 .css() 메서드는 HTML 요소의 

CSS 속성 값을 설정하거나 반환하는 데 사용됩니다.

.css() 메서드는 두 가지 방법으로 사용될 수 있습니다.

 

1. CSS 속성 설정

HTML 요소의 CSS 속성을 설정하려면 .css() 메서드에 CSS 속성 이름과 값을 전달하면 됩니다. 

예를 들어, 'id'가 "myDiv"인 'div' 요소의 배경색을 노란색으로 설정하려면 다음과 같이 사용할 수 있습니다.

$("#myDiv").css("background-color", "yellow");

이렇게 설정된 속성은 인라인 스타일로 HTML 요소에 직접 적용됩니다.

 

2. CSS 속성 반환

HTML 요소의 CSS 속성 값을 반환하려면 .css() 메서드에 CSS 속성 이름을 전달하면 됩니다. 

예를 들어, 'id'가 "myDiv"인 'div' 요소의 높이 값을 가져오려면 다음과 같이 사용할 수 있습니다.

var height = $("#myDiv").css("height");

이렇게 반환된 속성 값은 문자열 형태로 반환됩니다.

 

 

.css() 메서드는 CSS 속성을 하나 이상 설정하거나 반환할 수 있습니다. 

CSS 속성을 여러 개 설정하려면 객체 형태로 전달하면 됩니다. 

예를 들어, 'id'가 "myDiv"인 'div' 요소의 'background-color'와 'font-size' 속성을

설정하려면 다음과 같이 사용할 수 있습니다.

$("#myDiv").css({
  "background-color" : "yellow",
  "font-size" : "14px"
});

이렇게 설정된 속성은 인라인 스타일로 HTML 요소에 직접 적용됩니다.