꿈꾸는 개발자

CSS는 문서의 스타일을 따로 정의한다는 뜻을 가졌다. 이렇게 따로 정의하는것을 스타일시트라고 하며, 문서내에서 사용되는 방법을 CSS라고 한다. 사실 이러한 설명들은 CSS 책이나 인터넷에 CSS 만 검색해도 나오는것들이다. 그렇다면, "스타일시트와 CSS는 다른것일까?" 라는 의문이 생기기도 한다. 하지만 의문을 가질필요는 없다. 둘다 같은 의미를 가졌다. 일반적으로 문서에 적용되는 스타일은 CSS 방식을 사용한다. 또한 CSS 방식으로 된 스타일들을 묶어놓은것을 스타일시트라고 한다. 

암튼 HTML5 에선 CSS가 문서 스타일 타입의 표준이 되었기때문에, 스타일시트와 CSS의 의미를 두고 고민할 필요는 없다. 일단 아래의 예제를 살펴보도록 하자.

<link rel="stylesheet" media="all" href="style.css" type="text/css">

<style>
body{ background-color:#336699; }
</style>

<div style="color:blue; font-size:12px; height:100px"> 요소안에 정의 </div>

첫번째 예제의 CSS파일 로드같은경우 문서의 전체적인 스타일을 초기화 할때 많이 사용한다. 두번째 예제같은경우는 일반적으로 head 안에서 사용된다. 물론 head 가 아닌 다른곳에서 사용하여도 적용이 된다. 

세번째 예제같은 경우는 일반적으로 웹을 제작할때는 거의 사용하지 않는다. 그 이유중 하나는 문서의 유연성을 떨어트리고, 나중에 유지보수등이 힘들기 때문이다. 하지만 스크립트를 사용할땐 이런 방식을 사용하곤 한다. 그중 가장 흔한 예가 웹싸이트의 에디터를 이용할때이다. 티스토리의 에디터 또한 html 소스보기를 하면 이러한방식으로된 소스코드들을 확인할 수 있다.