jQuery | javascript | CSS

02.CSS - 외부스타일시트

Godffs 2009. 7. 27. 15:23
반응형
앞에 HTML에서 CSS를 적용하기 위해 <HEAD>부분에 Style를 정의해서 사용했습니다.
이번에는 <HEAD>부분에 Style를 정의 하지 않고 미리 정의된 스타일시트를
링크를 통해 적용하는 방법입니다.

CSS <LINK>를 사용하는 방법
1.HTML에서 간단하게 "안녕하세요" 를 출력 하도록 작성합니다.
                   <html xmlns="http://www.w3.org/1999/xhtml">
                   <head>
                       <title></title>
                   </head>
                   <body>
                       안녕하세요
                   </body>
                   </html>
          2. '새항목추가'-'스타일시트'를 선택 하고 추가 시켜줍니다. (이름 : 02.StyleSheet.css)
                 생성한 스타일시트에 다음과 같이 작성해 줍니다.
                 body
                 {
                     color:Blue;
                     font-size:12px;
                     font-family:Verdana;
                 }        body부분에 스타일시트를 적용시키기 위함 입니다.

             3. 다시 1번에서 작성한 <HTML>로 이동합니다. <HEAD>부분에 추가시켜줍니다.
             <link rel="Stylesheet" type="text/css" href="02.StyleSheet.css" />
                                                                          < css의 파일 명을 입력해 주셔야 합니다. >
               미리 정의된 스타일 시트를 불러와서 적용시키는 방법입니다.
               웹브라우저에 적용된것을 확인 할 수 있습니다.

                         두개 모두 존재해야 됩니다. 실행은 02.외부스타일시트.htm
반응형