CSS Normalize와 CSS Reset을 사용하는 이유는 아주 간단하다. 모든 사용자가 같은 화면을 보게 하기 위해서다. 우리는 같은 태그를 쓰고 같은 속성을 넣지만 브라우저가 해석하고 사용자에게 보여줄 때는 우리의 의도와 다르게 보여질 수 있다. CSS Normalize와 CSS Reset은 이러한 각 브라우저가 제공하는 기본 css를 통일하여 모든 사용자가 개발자의 의도에 맞는 화면을 보게 하기 위함이다.
CSS Normalize는 가능한 한 브라우저의 기본 스타일을 건들지 않고 브라우저간의 스타일을 통일시켜 준다. 그렇기에 어느 브라우저에서든 동일한 스타일을 볼 수 있다.
대표적인 CSS Normalize 오픈소스
CSS : https://necolas.github.io/normalize.css/
React(styled-compnent) : https://github.com/sergeysova/styled-normalize
CSS Reset은 CSS Normalize보다 좀 더 극단적으로 CSS를 초기화 할 때 사용된다. 기본적인 내장 스타일을 전부 지우고 자신이 스타일을 새로 만드는 경우 사용하면 좋다. 모든 CSS를 전부 초기화하지 않고 모든 태그의 margin이나 box-sizing을 바꾸는 정도로 사용되어도 좋다.
대표적인 CSS Reset 오픈소스
https://meyerweb.com/eric/tools/css/reset/
자신의 개발 상황에 맞게 CSS Normalize와 CSS Reset을 사용하면 좋을것이다. 작은 프로젝트나 브라우저의 기본 셋팅을 활용한다면 CSS Normalize를 사용하고, CSS를 처음부터 자신이 원하는대로 설게한다면 CSS Reset이 도움이 될 것이다. 결국 CSS Normalize와 CSS Reset는 자신의 선택이며 정해져있는것이 아니다. 필요한 부분만 가져다쓰는게 이득이다.