본문 바로가기
2012.03.15 21:44

CSS 적용방법

조회 수 2095 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print
?

단축키

Prev이전 문서

Next다음 문서

+ - Up Down Comment Print

http://blog.naver.com/rarecat85?Redirect=Log&logNo=80151753146


CSS 적용방법

 

1. 인라인 방식

태그에 직접 스타일을 적용하는 방식

ex) <p style="color:red;">...</p>

 

스타일을 바로바로 확인해 볼수 있다.

하지만 웹표준 이전의 방식과 차이가 없고, 유지보수에 불편하므로 비추하는 방식.

 

2. 임베디드 방식

헤드에 스타일을 지정해서 적용하는 방식

ex) <head>

     <style type="text/css" media="screen">

     h1 {color:#ffc;}

     </style>

     </head>

 

단일문서일때, 개발의 편의를 위해서 사용

인라인 방식에 비해 같은 스타일을 여러군데 적용할때 편리.


 

3. @import 방식

외부에 별도로 .css 파일을 만들어 적용하는 방식

ex) <head>

     <style type="text/css" media="screen">

     @import url(main.css);

     </style>

     </head>

 

구식 브라우저에서는 인식하지 못한다.

CSS파일 내부에서 다른 CSS파일을 불러올 수 있다.

 

4. link 방식

외부에 별도로 .css 파일을 만들어 적용하는 방식

ex) <head>

     <link href="main.css" rel="stylesheet" type="text/css" media="screen" />

     </head>

 

속도면에서 @import보다 빠르게 로딩된다.

많은 CSS파일을 관리하기에 편하다.

강추하는 방식.



Title
List of Articles
번호 제목 글쓴이 날짜 조회 수
11 Refresh HTML Page in Browser Automatically Hojung 2014.06.07 1347
10 div태그와 span태그 비교 Hojung 2013.12.07 2111
9 What is the difference between <section> and <div>? Hojung 2013.12.07 1589
8 CSS 선택자의 종류 Hojung 2012.03.15 2768
» CSS 적용방법 Hojung 2012.03.15 2095
6 CSS 강좌5 - CSS 레이아웃 생성 file Hojung 2012.03.15 3739
5 CSS 강좌4 - 주요 요소 설정 file Hojung 2012.03.13 2118
4 CSS 강좌3 - 갠버스 설정 file Hojung 2012.03.13 2068
3 CSS 강좌2 - 기본 html 작성 Hojung 2012.03.13 1991
2 CSS 강좌1 - 레이아웃 잡기 file Hojung 2012.03.13 8257
1 추천 CSS 강좌 (Good) Hojung 2012.03.13 2185
Board Pagination ‹ Prev 1 Next ›
/ 1

Designed by sketchbooks.co.kr / sketchbook5 board skin

나눔글꼴 설치 안내


이 PC에는 나눔글꼴이 설치되어 있지 않습니다.

이 사이트를 나눔글꼴로 보기 위해서는
나눔글꼴을 설치해야 합니다.

설치 취소

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5

Sketchbook5, 스케치북5