웹페이지를 만들때 CSS를 적용하는 방법을 알아봅니다. 어떻게 CSS를 적용할 수 있을까요?

CSS 파일을 적용하기 위해서는 파일내에서 직접 코드를 작성하는 인라인(inline) 방식외부 파일을 불러오는 방법으로 link 태그와 rel속성, 또는 @import를 사용하는 방법 두 가지가 있습니다. 그럼 외부 파일을 불러오는 방법에 대하여 알아보기 위해 아래 예제를 봐주시기 바랍니다.

A. link 태그를 사용하는 방법
<link rel="stylesheet" href="test.css" />


B. @import url을 사용하는 방법
<style>
@import url("test.css");
</style>


일반적으로 A의 방법을 많이 사용합니다. 그리고 link 태그를 사용하고 disable 속성을 사용하면 해당 파일을 적용할 것인지 아닌지를 결정할 수 있습니다. 만약 test.css 파일을 불러왔으나 적용하지 않기 원한다면? 아래와 같이 사용할 수 있습니다.

<link rel="stylesheet" href="test.css" disabled="false" />


반대로 disabled 속성을 true로 설정할 경우 아래의 css를 사용하게 될 것입니다.
<link rel="stylesheet" href="test.css" disabled="true" />


위 속성이 왜 필요할까라는 생각을 할 수도 있지만 css는 디바이스나 브라우저 또는 실행환경에 따라 다른 UI를 보여주어야 할 필요도 있기 때문에 몇개의 css를 작성 후 선택한 css 파일만 적용합니다.