[CSS] Reset CSS (+Normalize.css)

전예원·2021년 9월 28일
0

HTML, CSS 공부

목록 보기
15/18
post-custom-banner

브라우저마다 기본적으로 제공하는 스타일이 있다.
이런 기본값을 reset해주는 2개의 사이트를 알아보았다.

🔴 Reset CSS

🟠 Normalize CSS

🟡 용도?

  • 브라우저에서 저공하는 기본 스타일을 초기화 해준다.

  • 내가 코드로 넣지 않은 스타일이 있으면 작업 할 때 불편할 것이다. 이런 스타일을 초기화해준 코드를 매번 작성해야하는데 이런 귀찮은 작업을 오픈소스로 만들어준 파일이다.

  • 여러 글을 찾아보니 요즘에는 reset.css보단 normalize.css를 더 사용한다고 한다.

  • ❓❓❓ normalize.css가 reset.css보다 디자인적 요소가 가미되어있다고 한다. 또한 저 Meyer라는 개발자가 만들어놓은 reset css은 오래된 자료이기도 하고, 유용한 스타일까지도 초기화해서 비효율을 초래할 수 있다는 비판이 있다고 한다. 대신 normalize.css는 브라우저 간 유저 에이전트 스타일의 오차를 줄이고, 버그만 줄이는 방향으로 스타일을 재지정하는 것이라서 기본값을 최대한 보존하고 수정을 최소화한다고 한다.

  • 부트스트랩에도 normalize.css 코드가 포함되어 있기 때문에 부트스트랩을 쓴다면 별도의 normalize.css 코드를 안써도 될 수 있다고 한다.

🟤 사용방법

  • 두 개 중 맘에 드는 사이트로 들어가 링크에서 다운로드한 후에 css 폴더에 넣어 외부 스타일 시트를 연결해주면 된다.
  • cdn 방식으로 해서 외부 파일 다운 받지 않고 불러올 수도 있지만 비추라고 한다.
  • ❓❓❓ CDN : Contents Delivary Network
    즉, 필요한 정보를 실시간으로 다운로드해 사용하는 방법이라서 웹사이트가 느려질 수도 있음!
profile
앞으로 나아가는 중~
post-custom-banner

0개의 댓글