우당탕탕 개발일기
[CSS] 기본 css 초기화 하기 (reset.css) 본문
html로 작업할 땐 예쁘게 다듬는건 오로지 css로 작업하는게 좋대서
margin뿐만 아니라 heading 태그에 지정된 css 등 기본으로 세팅된 css를 초기화해주는 reset.css을 적용해보기로 했다.
https://www.jsdelivr.com/package/npm/reset-css로 접속한다.
jsDelivr - A free, fast, and reliable CDN for Open Source
Supports npm, GitHub, WordPress, Deno, and more. Largest network and best performance among all CDNs. Serving more than 80 billion requests per month. Built for production use.
www.jsdelivr.com
reset.css 파일이 존재하지만, reset.min.css를 추천! reset.css의 경량화 버전이라고 한다.
파일이 조금이라도 가벼운게 좋으니 나는 경량화 버전을 선택했다.
옆에 버튼에서 copy HTML을 선택 후, 복사 된 걸 html 파일의 <head> 태그 안에 넣어두면 된다. 매우 간단!
CSS 파일 작용보다 초기화가 먼저 일어나야하므로, <head> 태그 안에 연결한 css 파일 '위'에 복붙하면 된다.
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reset-css@5.0.1/reset.min.css">
내가 개발한 환경은 몇 개 되지않아 직접 확인했었는데 reset.css를 적용하면 굳이 직접 확인하지 않고도
크롬과 같이 브라우저 자체적인 css를 초기화하고, 다같은 css로 통일할 수 있어 좋은 것 같다. 일종의 크로스브라우징!
'What I Learned > HTML&CSS' 카테고리의 다른 글
| [HTML] html에서 자바스크립트 파일 작동 안할 때(defer) (0) | 2023.01.06 |
|---|---|
| [CSS] 가로 비율 맞는 직사각형 그리기 (0) | 2023.01.05 |
| [HTML] JSX에서 공백(띄어쓰기) 넣기 (0) | 2022.03.15 |
| [CSS] background-image로 사진 넣을 때 비율 맞추기 (0) | 2022.02.08 |
| [CSS] position (0) | 2022.02.07 |
