기억의 DataBase

인라인 방식 / 내장 방식 / 링크 방식 본문

CSS

인라인 방식 / 내장 방식 / 링크 방식

Zester; 2020. 3. 3. 21:21

인라인 방식

<div style="color: red">인라인 내용</div>

위와 같이 요소 내에 직접 style을 적용하는 것으로

변경시 하나하나 다 바꿔줘야 하기 때문에 지양된다.

(js로 조작되는 경우는 사용됨) 

 

 

내장 방식

<head>
   <style>
      div {
         color: violet;
      }
   </style>
</head>

HTML의 head 태그 내에 style을 작성하여

해당 html 파일 내에 적용하는 방식으로

재사용에 적합하지 않다.

(쓰기 제일 애매한듯...)

 

 

링크 방식

<head>
   <link rel="stylesheet" href="./css/main">
</head>

가장 권장되는 방식으로 변경과 유지보수 모두에 용이하다.

 

 

*세가지 모두가 쓰였을 때 적용의 우선순위

인라인 방식 > 내장 방식 > 링크 방식

(링크 방식을 기본으로 하고, 필요한 경우 인라인 방식을 쓰는게 BEST?)

Comments