[CSS3] 스타일 시트를 적용하는 방법들

아직 덜 작성된 글 입니다. 

스타일 시트를 적용하는 방법에는 크게 3가지가 있습니다.

1. 내부 스타일 시트

2. 외부 스타일 시트

3. 인라인 스타일 시트

이 세 가지가 있으며, 이들을 사용하는 방식과 특징에 대해서 하고 넘어가도록 하겠습니다.

이후 글에서 어떤 스타일에 관련해서 나오든 원하는 방식대로 기입해서 사용하시면 됩니다.

1. 내부 스타일 시트

내부 스타일 시트는 .html 파일 내부에 <style>태그 안에다가 스타일시트를 작성하는 방식 입니다.

이 방식은 파일하나의 길이가 다소 길어보일 수 있다는 점과 관리면에서 조금 떨어지는 방식 입니다.

http://개복디조합.메인.한국/

해당 사이트는 제가 작성한 웹 페이지인데. 서버를 열어 놓지 않고 웹 페이지를 게시할 수 있는 점이 좋았지만, 단일 웹 페이지로 작성하여야 했습니다.

그래서 소스 보기를 하면 내부 스타일 방식을 이용해서 전부 몰아 넣은 것을 확인할 수 있습니다.

2. 외부 스타일 시트

외부 스타일시트 방식은 *.css 확장자의 파일에다가 별도로 스타일시트를 작성하고 이를 html 문서에서 <link>태그를 이용하여서 불러오는 방식입니다.

파일 관리가 내부 스타일 방식에 비해서 편한 것이 장점이겠지요.

3. 인라인 스타일 시트

태그 내의 속성으로 style 을 사용하여서 기입하는 방식 입니다.

다른 스타일에 비해서 가장 높은 우선 순위를 가집니다.

예를 들어서 A라는 글씨를 붉은색으로 만들려는 내부또는 외부 스타일이 있지만, 인라인 스타일이 초록으로 설정하려하면 인라인으로 적용이 됩니다.

태그 하나에 하나의 스타일을 작성하는 방식이기 때문에 관리도 떨어지고 중복 재사용에 어려움이 있습니다.