프로그래밍/HTML 공부

브라우저 스타일 초기화

이자다 2022. 12. 14. 12:38
반응형

크롬 브라우저 html파일을 실행해보면 body태그에 기본으로 margin이 8px 적용된다. 이는 브라우저마자 제각각 다른데 웹 개발에 방해되니 이런 기본값들을 초기화하고 개발하는 게 좋다.

 

1. 검색창에 'reset.css cdn' 을 검색한다.

 

2. 검색 결과중에 'cdnjs.com', 'cdn.jsdelivr.net' 사이트의 결과에 들어간다. 나는 cdnjs.com 결과물에 들어갔다.

 

3. 들어가서 reset.css의 html 코드를 복사해서 index.html의 head태그에 붙여넣는다.

 

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css" integrity="sha512-NmLkDIU1C/C88wi324HBc+S2kLhi08PN5GDeUVVVC/BVt/9Izdsc9SVeVfA1UZbY3sHUlDSyRXhCzHfr6hmPPw==" crossorigin="anonymous" referrerpolicy="no-referrer" />

 

위의 링크태그가 cdnjs.com에서 가져온 reset.css 코드다.

 

4. 붙여넣고 저장 후 사이트를 실행하면 이전과 다르게 body태그의 margin값이 사라져있다.

반응형