doctype

6
<!DOCTYPE> <!DOCTYPE> 문문 문문 문문 문문 문문 문문

Upload: mijin-lee

Post on 10-Jun-2015

246 views

Category:

Education


1 download

TRANSCRIPT

Page 1: Doctype

<!DOCTYPE><!DOCTYPE>

문서 형식 선언문서 형식 선언

Page 2: Doctype

1.1. 문서형 정의 및 선언문서형 정의 및 선언 <!DOCTYPE>:<!DOCTYPE>: 문서 형식 선언문서 형식 선언 DTDDTD 란란 ??Document Type Definition (Document Type Definition ( 문서형 정의문서형 정의 ))마크업 문서의 요소와 속성등을 어떤 규칙에마크업 문서의 요소와 속성등을 어떤 규칙에따라 기술해야 하는지에 대한 기준따라 기술해야 하는지에 대한 기준

○○ 마크업 문서를 작성하려면 문서의 첫머리에 마크업 문서를 작성하려면 문서의 첫머리에 문서형 정의를 문서형 정의를 ““선언선언”” 해 주어야 한다 해 주어야 한다 ..

Page 3: Doctype

2. 2. 문서형 정의와 선언을 하는이유문서형 정의와 선언을 하는이유

문서형 정의문서형 정의 (DTD)(DTD) 의 종류에 따라 의 종류에 따라 특정요소의 사용이 제한되거나 규칙이 특정요소의 사용이 제한되거나 규칙이 다르게 적용되며다르게 적용되며 , , 웹 브라우저에서 웹 브라우저에서 문서가 렌더링 되는 기준이 된다문서가 렌더링 되는 기준이 된다 ..

문서형 정의를 선언해 주지않으면 크로스 문서형 정의를 선언해 주지않으면 크로스 브라우징 환경에서 각각의 문서가 다르게 브라우징 환경에서 각각의 문서가 다르게 표현되는 원인이 된다 표현되는 원인이 된다 (quirks mode (quirks mode 쿽스모드쿽스모드 ) )

Page 4: Doctype

3. DTD 3. DTD 의 종류의 종류 (html4.01)(html4.01)

Strict(Strict( 엄격형엄격형 ))<!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC ““-//W3C//DTD HTML 4.01//EN-//W3C//DTD HTML 4.01//EN””http://www.w3.org/TR/html4/strict.dtd>>

Transitional(Transitional( 호환형호환형 ))<!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC ““-//W3C//DTD HTML 4.01//EN-//W3C//DTD HTML 4.01//EN””http://www.w3.org/TR/html4/loose.dtd>>

Frameset(Frameset( 프레임형프레임형 ))<!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC ““-//W3C//DTD HTML 4.01//EN-//W3C//DTD HTML 4.01//EN””http://www.w3.org/TR/html4/frameset.dtd>>

Page 5: Doctype

3. DTD 3. DTD 의 종류의 종류 (xhtml1.0)(xhtml1.0)

Strict(Strict( 엄격형엄격형 ))<!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC ““-//W3C//DTD XHTML 1.0 Strict//EN-//W3C//DTD XHTML 1.0 Strict//EN””http://www.w3.org/TR/html4/strict.dtd>>

Transitional(Transitional( 호환형호환형 ))<!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC ““-//W3C// DTD XHTML 1.0 Transitional //EN-//W3C// DTD XHTML 1.0 Transitional //EN””

http://www.w3.org/TR/html4/transitional.dtd>http://www.w3.org/TR/html4/transitional.dtd>

Frameset(Frameset( 프레임형프레임형 ))<!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC ““-//W3C// DTD XHTML 1.0 Frameset//EN-//W3C// DTD XHTML 1.0 Frameset//EN””

http://www.w3.org/TR/html4/frameset.dtd>http://www.w3.org/TR/html4/frameset.dtd>

Page 6: Doctype

5.5. 표준모드와 쿽스모드표준모드와 쿽스모드어느것이 표준모드로 렌더링 될까요어느것이 표준모드로 렌더링 될까요 ? ? <!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC ““-//W3C//DTD XHTML 1.0 Strict//EN-//W3C//DTD XHTML 1.0 Strict//EN””>>

<-<- 문서에 맞는 문서에 맞는 dtddtd 가 선언되지 않았다가 선언되지 않았다 . . 쿽스모드로 렌더링쿽스모드로 렌더링 <!DOCTYPE html> <!DOCTYPE html>

<- html5<- html5 는 기술적 제한으로 인해 는 기술적 제한으로 인해 dtd dtd 선언없이 선언없이 doctypedoctype 규정규정 <!DOCTYPE html PUBLIC <!DOCTYPE html PUBLIC ““-//W3C// DTD XHTML 1.0 Transitional //EN-//W3C// DTD XHTML 1.0 Transitional //EN””

http://www.w3.org/TR/html4/transitional.dtd>http://www.w3.org/TR/html4/transitional.dtd>

문서타입을 선언하고 문서타입을 선언하고 dtd dtd 종류를 맞게 넣어줌 표준모드로 렌더링종류를 맞게 넣어줌 표준모드로 렌더링

쿽스모드쿽스모드 (quirks mode)(quirks mode) 는 웹 브라우저가 점점 표준에 맞게 는 웹 브라우저가 점점 표준에 맞게 개선되면서 이전의 오래된 웹 페이지들을 정상적으로 보여주기 위해 개선되면서 이전의 오래된 웹 페이지들을 정상적으로 보여주기 위해 최신버전의 브라우저에서 제공하는 호환모드를 말한다최신버전의 브라우저에서 제공하는 호환모드를 말한다 ..

이 모드에선 같은 코드라도 각각의 브라우저 마다 다르게 이 모드에선 같은 코드라도 각각의 브라우저 마다 다르게 해석하기때문에 전혀 다른 결과물을 보여주기도 한다해석하기때문에 전혀 다른 결과물을 보여주기도 한다 ..