프로그래밍/PHP

메타태그를 이용한 IE 쿼크모드(호환성보기) 설정

가카리 2013. 11. 22. 19:49
반응형

IE(인터넷 익스플로러)의 경우 여러 가지 버전이 있습니다. IE7, IE8, IE9 그리고 최근엔 IE10이 나온 바로 그것입니다. 그런데 이들 IE간에 버전차이로 인해 같은 웹 문서라 하더라도 다르게 보여지는 경우가 있습니다. 그것은 이들 IE 버전에 따라서 마크업과 CSS를 랜더링을 다르게 하기 때문입니다.


이러한 문제를 해결하기 위해서 MS에서 제공하는 기능이 바로 "호환성 보기" 라는 기능입니다. 이 "호환성 보기" 라는 기능을 통해서 IE 버전이 다르더라도 같은 화면을 볼 수 있도록 합니다. 그리고 호환성 보기를 다른 말로 쿼크모드라고 합니다.


하지만 이러한 호환성 보기 기능을 모든 사용자들이 직접 사용하길 바라는 것은 무리겠지요? (호환성 보기 기능을 모르는 사용자도 많으니까요.) 홈페이지를 만들다 보면 IE에서 자동으로 호환성 보기 기능이 활성화 되기를 바라는 경우가 생길 수 있습니다. 이러한 경우를 해결할 수 있는 방법으로 웹 문서에 아래 메타태그를 추가하는 방법이 있습니다.


<meta http-equiv="X-UA-Compatible" content="IE=7" />


위 메타태그를 <head></head> 태그 사이에 삽입하기만 하면 됩니다. 그러면 IE 웹 브라우저에서 해당 웹 문서를 읽을 때 자동으로 호환성 보기 기능이 활성화가 됩니다.


그리고 메타태그의 내용 뒷 부분(...content="IE=7" />)을 보시면 아시겠지만, IE7버전을 기준으로 보여지도록 되어있습니다. 호환성 보기로 실행하되, 해당 웹 문서는 IE7로 보여주겠다는 의미가 됩니다. 만약 다른 IE 버전을 기준으로 보여지도록 하고싶다면 뒤에 "IE=버전명" 을 변경하시면 됩니다.


<meta http-equiv="X-UA-Compatible" content="IE=5" />

<meta http-equiv="X-UA-Compatible" content="IE=6" />

<meta http-equiv="X-UA-Compatible" content="IE=7" />

<meta http-equiv="X-UA-Compatible" content="IE=8" />

<meta http-equiv="X-UA-Compatible" content="IE=9" />

<meta http-equiv="X-UA-Compatible" content="IE=edge" />


IE=edge는 가장 최신 버전으로 랜더링 하겠다는 의미입니다. 예를 들어서 IE8을 사용하고 있는 사용자라면, IE8이 가지고 있는 가장 최신의 랜더링 방법으로 웹 문서를 보여주겠다는 의미가 됩니다.

 

출처 : http://blog.daum.net/dosman1/878

반응형