웹 브라우저에는 많은 종류가 있으며 각 브라우저에 기본으로 적용된 독자적인 CSS가 존재합니다.
그렇기 때문에 브라우저 마다 다르게 표시되는 것이며 이를 방지하기 위해 CSS를 초기화하면 브라우저에 기본적으로 적용된 CSS를 취소해 다른 브라우저에서도 웹 페이지가 동일하게 보이는 효과를 가져옵니다.
초기화 방법
직접 CSS를 초기화해도 되지만 공개된 CSS를 사용하면 더 편하게 초기화 할 수 있다.
destyle.css
https://github.com/nicolas-cusan/destyle.css
GitHub - nicolas-cusan/destyle.css: Opinionated reset stylesheet that provides a clean slate for styling your html.
Opinionated reset stylesheet that provides a clean slate for styling your html. - GitHub - nicolas-cusan/destyle.css: Opinionated reset stylesheet that provides a clean slate for styling your html.
github.com
https://raw.githubusercontent.com/nicolas-cusan/destyle.css/master/destyle.css
사용할때는 순서를 주의해야합니다.
반드시 CSS 초기화가 가장 먼저 적용되어야 합니다.
<head>
<meta charset="utf-8">
<title>CSS 초기화</title>
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="https://raw.githubusercontent.com/nicolas-cusan/destyle.css/master/destyle.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
CSS를 초기화하는 다른 대표적인 방법
Destyle.css외에도 CSS를 초기화하는 방법으로 몇가지가 더 있습니다.
'Web' 카테고리의 다른 글
| [CSS] Selector 정리 (0) | 2022.12.18 |
|---|---|
| [CSS] 벤더 프리픽스(Vendor Prefix)란? (0) | 2022.12.09 |
| [HTML] HTML 기본 정리 (0) | 2022.12.09 |
| [Web] json-server를 활용하여 로컬에 JSON서버 구축하기 (1) | 2022.11.23 |
| [CSS] Box Model과 Box Sizing (0) | 2022.10.17 |
