CSS 적용방법
1. In-Line 방식
- HTML 태그에 직접 Style 속성을 삽입하여 스타일을 적용하는 방법입니다.
- 각 페이지마다 스타일이 기술되기에 직관적으로 바로바로 확인되지만 유지보수가 불편하다는 단점이 있습니다. 특별한 경우가 아니라면 사용을 자제하는 것이 좋습니다.
- 예시 :
<p style="font-family:돋움;">...</p>
2. Embedded 방식
- HTML 문서에 <head> 혹은 <body> 태그에 <style> 태그를 직접 선언함으로써 스타일을 지정해서 적용하는 방식입니다.
- 예시 :
<head>
<style type="text/css" media="screen">
h1 {color:blue;}
</style>
</head>
3. Import 방식
- css 파일에만 스타일을 기술합니다. Link 방식과 유사하지만 하나의 css 파일로 여러개의 웹사이트에 적용하거나 style 내부에서 다른 css를 불러올 수 있다는 개념이 다릅니다.
- 낮은버전의 브라우저에서는 Import 방식을 인식하지 못하는 호환성 문제를 가지고 있습니다.
- Link 방식보다 호환성과 속도면에서 뒤쳐집니다.
- 예시 :
<head>
<style type="text/css" media="screen">
@import url(main.css);
</style>
</head>
4. Link 방식
- Import 방식보다 호환이나 속도 면에서 우월하기에 가장 추천하는 방식입니다.
- 예시 :
<head>
<link href="main.css" rel="stylesheet" type="text/css" media="screen" />
</head>