CSS의 스타일 우선순위 CSS의 스타일 우선순위는 다음과 같은 요인에 의해 결정된다: !important: !important가 선언에 붙어 있는 경우, 그 스타일이 가장 높은 우선순위를 가진다. 단, 사용자 스타일시트의 !important는 제작자 스타일시트의 !important보다 높은 우선순위를 가진다. 인라인 스타일(Inline Styles): HTML 요소의 style 속성에 직접 선언된 스타일이 있다면 그 스타일이 우선순위가 높다. 특정성(Specificity): 선택자의 특정성이 높을수록 해당 스타일이 우선순위가 높다. 특정성은 ID 선택자, 클래스/속성/가상 클래스 선택자, 태그/가상 요소 선택자의 갯수에 따라 계산된다. ID 선택자: 가장 높은 특정성을 가진다. (#id) 클래스/속성/..

배경 React.js를 배우며 웹페이지를 꾸미는 CSS에도 여러 방식이 있다는 것을 알게 되었다. 각각의 방식의 특징과 장단점을 적어보고자 한다. 특징 기본적인 CSS 파일 방식 특징: 전통적인 방식이다. CSS 파일을 별도로 작성하고 필요한 곳에서 불러와 사용한다. 장점: CSS에 익숙한 개발자들에게는 가장 직관적이고 쉽다. 모든 브라우저에서 호환이 가능하다. 단점: CSS 선택자가 전역적으로 작동하기 때문에, 스타일 충돌이 발생할 수 있다. 또한, CSS와 JS가 분리되어 있어, 컴포넌트 기반의 설계를 위해선 추가적인 작업이 필요하다. CSS Modules 특징: CSS를 모듈로 만들어, 각 컴포넌트에 독립적인 CSS를 적용하는 방식이다. 장점: CSS 클래스의 이름이 지역적인 범위를 가지므로, 이름..