CSS 적용 방식

인라인(inline) 방식

<h1 style="color:aqua; background-color:blueviolet;">인라인</h1>
  • 인라인 방식은 요소의 style 속성에 직접 스타일을 작성하는 방식이다.
  • 그러나 이 방식은 불편하다.

    • 내장 Style 방식

  • <style></style>의 내용(Contents)으로 스타일을 작성하는 방식
  • 그러나 내장 Style의 경우도 스타일이 바뀌면 모든 HTML 문서에서 바꿔줘야 하고 다른 HTML 문서에 적용이 어렵다는 단점이 있다.

    • 링크 방식

  • 모든 Style을 하나의 CSS 파일에 넣고, 필요한 HTML 파일에서 해당 파일을 링크해서 사용하는 방식이다.
  • 재사용, 스타일 변경 등이 모두 가능하다.
  • 다른 CSS 파일의 코드를 가져와야 할 때는 css 파일 안에서 @import 방식을 사용한다.

    • 3가지 방식의 우선 적용 순위

    ▶️ (인라인 방식) > (내장 방식) ? (링크 방식)

  • 기본적으로 HTML 문서에서 가장 늦게 읽히는 것이 우선으로 적용된다.
  • 인라인 방식은 내장, 링크 방식에 우선하여 적용된다.
  • 내장, 링크 방식 중에서는 HTML 문서에서 늦게 읽히는 것이 우선된다.

    • CSS의 주석

    div {
    	/*이 안의 내용은 주석으로 처리됩니다.*/
    }