많은 양의 html파일에 동일한 style 코드가 중복될 때,
중복되는 코드를 별도의 css파일에 저장한 후 불러오기
<style>
body{
margin:0;
}
a{
color:black;
text-decoration:none;
}
h1{
font-size:45px;
text-align:center;
border-bottom:1px solid gray;
margin:0;
padding:20px;
}
ol{
border-right:1px solid gray;
width:100px;
margin:0;
padding:20px;
}
#grid{
display: grid;
grid-template-columns: 150px 1fr;
}
#grid ol{
padding-left:33px
}
#grid #article{
padding-left:25px;
}
@media(max-width:800px){
#grid{
display: block;
}
ol{
border-right:none;
}
h1{
border-bottom:none;
}
}
</style>
파일명 ex) style.css
❗️ style 태그는 포함 ❌
<link rel="stylesheet" href="style.css">
네트워크적인 측면에서는 css파일을 따로 만드는 것이 비효율적이지만,
캐싱의 측면에서는 효율적이다