-
HTML문서에 스타일을 적용하는 방법은 외부 스타일 시트, 내부 스타일 시트, 인라인 스타일 3가지로 분류된다.
외부 스타일 시트
- 외부 스타일 시트는 css파일을 <link>나 @import로 HTML문서에 연결해서 사용
- <link>
- @import
- 하나의 CSS파일만 수정하면 해당 스타일시트를 사용하는 모든 페이지에 변경내용 적용
- 외부 스타일 시트는 세 가지 방법 중 가장 많이 사용
내부 스타일 시트
-
내부 스타일 시트는 <style>을 이용하여 HTML페이지 내부에 CSS 적용.
-
<style>은 <head>안에 작성
-
내부 스타일 시트는 페이지마다 반복해서 작성하는 단점이 있다.
-
여러 페이지에 동일한 스타일을 적용해야 할 경우 외부 스타일 시트를 사용
인라인 스타일 시트
- 인라인 스타일은 style attribute를 사용하여 개별 element에 스타일을 적용
- Style 속성의 값은 CSS 규칙의 선언(declaration)과 같다.
- 하나 이상의 속성을 적용할 수 있으며, semi-colon(;)으로 구분
- 세 가지 스타일을 모두 사용했을 때 가장 먼저 반영
일반적인 우선순위
(단, 내부 스타일 다음에 외부 스타일 링크가 위치할 경우 외부의 우선순위가 높아지게 된다.)
- 외부 스타일 시트는 css파일을 <link>나 @import로 HTML문서에 연결해서 사용
- 인라인 스타일 → 내부 스타일 → 외부 스타일
'Web' 카테고리의 다른 글
[CSS] CSS란? (0) | 2021.03.04 |
---|