Document Type(DTD)에 따라서 다르게 표현되는 현상이 확인되어 포스팅 합니다.
일반적으로 사용하는 DTD 형식은 다음과 같습니다.
HTML 4.01 Transitional
HTML 4.01 Strict
HTML 5
XHTML 1.0 Transitional
XHTML 1.0 Strict
XHTML 1.1
XHTML 1.1
XHTML Mobile 1.0
위의 2개의 HTML 화면이 있습니다. Tabel 로 구성된 HTML 문서이며, DTD 형식이 다릅니다.
DTD 사용시 표현방법에 따라서 아래와 같이 오류와 정상으로 표시되는 것을 정리했습니다.
그외의 것들은 Table 이 아닌 DIV 를 사용해서 화면 구성해야만 의도한 모습으로 표현이 되니 사용이 주의가 요합니다.
1) < 정상 > HTML 4.01 Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
2) < 오류 >HTML 4.01 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
3) < 오류 > HTML 5
<!DOCTYPE html>
<html lang="ko">
4) < 정상 >XHTML 1.0 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
5) < 오류 >XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
6) < 오류 >XHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
7) < 오류 >XHTML Mobile 1.0
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
이것에 대한 해결방법이나 이유를 아시는분 코멘트 부탁드립니다.
일반적으로 사용하는 DTD 형식은 다음과 같습니다.
HTML 4.01 Transitional
HTML 4.01 Strict
HTML 5
XHTML 1.0 Transitional
XHTML 1.0 Strict
XHTML 1.1
XHTML 1.1
XHTML Mobile 1.0
위의 2개의 HTML 화면이 있습니다. Tabel 로 구성된 HTML 문서이며, DTD 형식이 다릅니다.
DTD 사용시 표현방법에 따라서 아래와 같이 오류와 정상으로 표시되는 것을 정리했습니다.
그외의 것들은 Table 이 아닌 DIV 를 사용해서 화면 구성해야만 의도한 모습으로 표현이 되니 사용이 주의가 요합니다.
1) < 정상 > HTML 4.01 Transitional
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
2) < 오류 >HTML 4.01 Strict
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
3) < 오류 > HTML 5
<!DOCTYPE html>
<html lang="ko">
4) < 정상 >XHTML 1.0 Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
5) < 오류 >XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
6) < 오류 >XHTML 1.1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
7) < 오류 >XHTML Mobile 1.0
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
이것에 대한 해결방법이나 이유를 아시는분 코멘트 부탁드립니다.
댓글 6개
테이블이 깨지는 현상은 CR/LF 코드를 특수문자로 인식할 때 나타났습니다. 브라우저 마다 소스코드 편집기에서 붙게 되는 개행문자를 무시하는 것도 있고 인식하는 것도 있었습니다.
편집기에서 엔터를 쳐서 줄바꿈을 하면 문자열 끝에 이런 개행 문자가 붙는다는 건 자료구조 시간에 다 배우는 것이니...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
두 개의 독타입을 봤을 때 xhtml 규정을 loose, transitional로 엄격하지 않게 적용했을 때 테이블이 깨지지 않는 걸로 봐서 css 보다는 브라우저 종류와 버전에 영향이 있는 거 같습니다.
CR/LF를 특수문자로 해석해서 브라우저에 송출했을 때 table 태그를 해석 할 때 이것을 무시하느냐 그대로 브라우저에 출력하느냐에 차이가 있는 거 같습니다. loose나 transitoinal은 그렇게 까다로운 독타입이 아니니 아마도 태그 해석 할 때 특수 문자(눈에는 보이지 않지만 저장 했을 때 바이너리 코드 형태로 존재하는)는 무시하는 게 아닐까 싶네요.
약 2,3년 전에 이런 테이블 개행문자 인지로 인한 테이블 깨짐 현상을 접했는데 물론 제가 틀렸을 수도 있습니다. 코드를 봐야 알겠지만 당시에는 <tr><td> 태그를 개행하지 않는 걸로 해결을 봤습니다.
편집기에서 엔터를 쳐서 줄바꿈을 하면 문자열 끝에 이런 개행 문자가 붙는다는 건 자료구조 시간에 다 배우는 것이니...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
두 개의 독타입을 봤을 때 xhtml 규정을 loose, transitional로 엄격하지 않게 적용했을 때 테이블이 깨지지 않는 걸로 봐서 css 보다는 브라우저 종류와 버전에 영향이 있는 거 같습니다.
CR/LF를 특수문자로 해석해서 브라우저에 송출했을 때 table 태그를 해석 할 때 이것을 무시하느냐 그대로 브라우저에 출력하느냐에 차이가 있는 거 같습니다. loose나 transitoinal은 그렇게 까다로운 독타입이 아니니 아마도 태그 해석 할 때 특수 문자(눈에는 보이지 않지만 저장 했을 때 바이너리 코드 형태로 존재하는)는 무시하는 게 아닐까 싶네요.
약 2,3년 전에 이런 테이블 개행문자 인지로 인한 테이블 깨짐 현상을 접했는데 물론 제가 틀렸을 수도 있습니다. 코드를 봐야 알겠지만 당시에는 <tr><td> 태그를 개행하지 않는 걸로 해결을 봤습니다.
게시글 목록
| 번호 | 제목 |
|---|---|
| 32970 | |
| 32959 | |
| 32937 | |
| 32917 | |
| 32909 | |
| 32899 | |
| 32885 | |
| 32884 | |
| 32862 | |
| 32861 | |
| 32860 | |
| 32840 | |
| 32814 | |
| 32804 | |
| 32795 | |
| 32784 | |
| 32783 | |
| 32750 | |
| 32740 | |
| 32732 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기