[CSS] Reset CSS와 Normalize CSS이란 무엇일까?

Reset CSS, Normalize CSS는 브라우저마다 HTML 요소에 대한 기본 CSS값이 다르기 때문에 그 차이를 없애기 위해 필요하다(크로스 브라우징을 위해 사용).

 

Reset.css

모든 브라우저의 내장 스타일을 '없애는' 기법이다.

아무 스타일도 없는 상태에서 스타일링을 시작하며, 공식적으로 권장하는 기법이라기보다 실무에서 편의에 의해 임의로 지정하는 설정이다.

 

* {
  margin: 0;
  padding: 0;
  border: none;
}

초기에 reset이라는 개념이 잡히기 전에는 *으로 초기화하는 방법을 많이 사용했으나 전역으로 사용되는만큼 불필요한 렌더링이 발생해 최근에는 많이 사용되지 않는다. Eric Mayer의 reset.css를 많이 이용한다.

CSS Tools: Reset CSS

 

Normalize.css

모든 브라우저의 '스타일을 동일하게' 하는 기법이다.

브라우저(모바일 브라우저 포함)를 광범위하게 지원하며, Reset css와는 달리 기존의 스타일을 유지하되 브라우저들의 다른 스타일을 고치는 방식이다.
최근에는 reset.css보다는 Normalize가 많이 사용되고 있다.

normarlize-Libraries

 

참고

• 크로스 브라우징을 위한 Reset CSS, Normalize CSS
• Reset.css vs Normalize.css
• reset.css 와 Normalize.css