티스토리 뷰

DEVELOPE/CSS

CSS 외부파일 불러오기

소찾나 2017. 10. 27. 09:59
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

CSS 외부파일 불러오기

CSS 외부파일 불러오기

CSS 외부파일 불러오기



웹페이지를 작성시 스타일시트의 위치는 <head> 태그 내에 존재해야 하며 이를 페이지에서 정의하게되면 


css 정의의 관리가 힘들어 외부에 css 파일을 만들어서 정의하고 관리하면 웹페이지 제작을 편리하게 작업을 할 수 있다.


원래 css가 만들어진 취지 자체가 html 문서와 디자인적인 요소 css(스타일시트) 를 분리하여 웹페이지


의 간소화하고 디자인적인 요소를 따로 관리하기 쉽게하기 위한 것이기 때문에 외부파일로 처리하는 것을


추천한다. 물론 간단한 스타일 이라면 html 내에 정의해도 상관은 없겠다.





1 외부에 css 파일을 불러오는방법


스타일 css 태그의 정의를 한 파일(확장자 css) 를 작성후 특정한 폴더에 넣어두고 해당 파일의 url 로 불러오는 방식


1
2
3
<head>
<link rel="StyleSheet" type="text/css" href="/css.css">                                               
</head>                                               
cs



2 import 로 삽입하는 방법


@import 명령어로 css 파일을 <head> 태그내에 삽입하거나 css 파일내에 정의해서 사용함 유의할점은 다른 스타일보다


 먼저 정의되어야 함


1
2
3
4
5
6
7
8
9
10
<head>
<style type="text/css">
<![CDATA[
    @import 파일의 url; or @import "파일명";                                                             
//]]>
 
</style>
</head>                                 
cs


1
2
3
4
5
6
7
8
9
10
<head>
<style type="text/css">
   @import url('style.css'); /* 절대경로와 상대경로 모두 가능                                             
</style>
</head>
cs



이글이 도움이 되셨다면 아래에 로그인이 필요없는 공감 버튼을 클릭해주세요 ^^

'DEVELOPE > CSS' 카테고리의 다른 글

CSS border-radius 모서리 부드럽게 처리및 원그리기  (0) 2017.11.30
CSS 외각선 형식  (0) 2017.11.11
CSS DIV 속성 position  (0) 2017.10.27
CSS 폰트(Font) 글꼴속성  (0) 2017.10.26
CSS hover 사용법  (0) 2017.10.26
공유하기 링크
댓글