BEM 웹은 덩어리, 구성 요소, 변형의 반복으로 이루어져 있다 CSS selector specificity (선택자 우선순위 규칙) 특이성(구체성)이 높은 순서 : id → class → type CSS 선택자의 우선 순위를 높여 놓으면, 그 선택자를 덮어쓰기 위해서는 더 높은 선택자 규칙이 필요하므로 선택자가 점점 길어짐 선택자 특이성 점수는 '020' 보다 낮게 유지하는 것이 CSS 선택자와 코드를 관리하는데 유용 type 선택자 : HTML 요소를... CSS selector specificityAtomic/Utility First CSScss 선택자BEMCSSAtomic/Utility First CSS CSS의 진화과정 CSS CSS는 HTML을 꾸며주기 위해 사용하는 스타일시트 언어 단점은 어떤 CSS가 적용될지 예측하기 어렵고, 코드 재사용이 어렵다. SCSS @import @import 구문을 사용하면 다른 sass 파일을 불러올 수 있다. 장점은 css 파일을 쉽게 모듈화 하고, 나누어 작업이 가능하다. SCSS 단점 파일을 분리했지만 중첩 선언이 있는 경우 어떤 것이 먼저 적용될지 가늠이 되지 않는... css-modulesCSSscssstyled componentsBEMBEM
웹은 덩어리, 구성 요소, 변형의 반복으로 이루어져 있다 CSS selector specificity (선택자 우선순위 규칙) 특이성(구체성)이 높은 순서 : id → class → type CSS 선택자의 우선 순위를 높여 놓으면, 그 선택자를 덮어쓰기 위해서는 더 높은 선택자 규칙이 필요하므로 선택자가 점점 길어짐 선택자 특이성 점수는 '020' 보다 낮게 유지하는 것이 CSS 선택자와 코드를 관리하는데 유용 type 선택자 : HTML 요소를... CSS selector specificityAtomic/Utility First CSScss 선택자BEMCSSAtomic/Utility First CSS CSS의 진화과정 CSS CSS는 HTML을 꾸며주기 위해 사용하는 스타일시트 언어 단점은 어떤 CSS가 적용될지 예측하기 어렵고, 코드 재사용이 어렵다. SCSS @import @import 구문을 사용하면 다른 sass 파일을 불러올 수 있다. 장점은 css 파일을 쉽게 모듈화 하고, 나누어 작업이 가능하다. SCSS 단점 파일을 분리했지만 중첩 선언이 있는 경우 어떤 것이 먼저 적용될지 가늠이 되지 않는... css-modulesCSSscssstyled componentsBEMBEM