디자인 모든 것/CSS

[CSS기초]CSS3 문서 적용하는 방법

Do_Do!! 2017. 8. 16. 12:02

▶ [CSS기초] CSS3 문서 적용 하는 방법

 

CSS문서를 적용시키는 방법은 크게 3가지로 나눌 수 있습니다. 내부스타일, 외부스타일, 인라인스타일 적용으로 나뉘어 집니다.

 

1. 내부스타일 적용 (Embedded 스타일 적용)

 

 

HTML 파일 내에 CSS 코드를 직접 포함하여 스타일이 적용되도록 하는 방법으로 내부스타일을 적용 할 때는 <head>태그안에 넣어주거나 또는 </html>밖에 입력해주셔도 크게 상관은 없습니다.

 

 

2. 외부스타일 적용 (External 스타일 적용)

 

 

CSS 파일을 외부에 생성하여 HTML 문서에 연결하는 방식으로 <link>요소를 사용하는 방법과 @import 명령을 사용하는 두 가지 방식이 있습니다.

 

 

3. 인라인 스타일 적용 (Inline 스타일 적용)

 

 

특정 HTML 요소에 style 속성을 사용하여 CSS코드를 선언하는 방법입니다.

그러나 이 방법은 구조와 표현의 분리라는 관점에서 바람직하지 않은 면은 가지고 있습니다. 특히 Inline 방식의 스타일은 선택자의 우선순위가 가장 높기 때문에 스타일의 재정의가 어렵거나 불가능한 경우가 발생할 수 있으므로 사용에 주의가 필요합니다.

 

★ CSS 기본 문법 추가 설명

 

CSS를 적용할 때는 세미콜론으로 구분하여 여러 개의 선언을 지정할 수 있습니다.

 

선택자(selector) { property(속성) : value(속성값); property(속성) : value(속성값); } 

 

★ 주석을 다는 방법

 

/* CSS에서 사용할 수 있는 주석 입니다*/

주석을 사용하면 웹 페이지 상에서는 보여지지는 않습니다. 그러나 탐색기로는 소스가 보여지기 때문에 사용하지 않는 경우에는 아예 삭제하는 것이 좋습니다.

 

★ 사용단위( 주로 웹 페이지를 만들때 사용하는 단위를 적었습니다 )

 

- 상대단위

em : 폰트의 기본 크기 값에 비례한 단위

 

- 절대단위

px : 픽셀(pixel)단위로, 1/72inch와 같음

 

누구나 파워지식인이 되는 그날까지, 늘보지식인

#Copyleft(C)는 저작권의 반대개념으로, "모든것을 공유한다" 는 뜻입니다#

#사진과 이미지의 일부는 퍼온것도 있음을 밝힘니다#