[HTMl/CSS] 엘리먼트의 모든 CSS 스타일 속성 / 값 조회하기

인자로 넘긴 요소에 적용된 모든 CSS 속성 조회

---

Window.getComputedStyle(element, [pseudoElt])

 

const styles = getComputedStyle(element);
 
// {0: 'accent-color', 1: 'align-content', 2: 'align-items', ...}
console.log(styles);

 

인자로 넘긴 CSS 속성에 대한 값 조회

---

CSSStyleDeclaration.getPropertyValue(property)

 

const styles = getComputedStyle(element);
 
// 'normal' (align-items에 대한 속성 값 normal 반환)
styles.getPropertyValue('align-items'); 
 
// 'normal' (위와 동일)
styles.alignItems;

 

---

글 수정사항은 노션 페이지에 가장 빠르게 반영됩니다. 링크를 참고해 주세요