IE9 이하에서 HTML5 사용을 위한 필수요건

IE9 이하에서 HTML5 사용을 위한 필수요건

 IE8에서 레이아웃 컨트롤

 

IE9 미만에서 HTML5 엘리먼트 지원 (구글 코드에서 다운로드)

1 2 3

<!--[if lt IE 9]> <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]-->

위 코드가 html5shiv가 지원하는 HTML5 엘리먼트

1	article, aside, canvas, details, figcaption, figure, footer, header, hgroup, nav, menu, nav, section { display: block; }

 

IE7 미만에서 HTML 및 CSS 엘리먼트, 투명 PNG 지원 (구글 코드에서 다운로드)

1 2 3 4 5 6 7 8 9 10 11

<!--[if lt IE 9]> <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script> <![endif]-->   <!--[if lt IE 8]> <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script> <![endif]-->   <!--[if lt IE 7]> <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE7.js"></script> <![endif]-->

이는 현재 사용하는 IE보다 버전이 낮을 경우 작동하는 스크립트로 버전이 낮은 브라우저에서 호환성을 보장하게 만들어줍니다.
저는 <!–[if IE 9]> 이런 형식으로 IE9일때만 혹은 IE8일때만 불러올 수 있도록 변경해서 사용중입니다.
특히 IE8부분은 아예 제거를 해버리니 레이아웃이 정상적으로 나오더군요!!
참고만 해주세요! 각자의 환경에 따라 다르게 작동할 수 있으니 유의하셔서 작업하시기 바랍니다.

 

IE9 미만에서 HTML5 DOM 인식

1 2 3 4 5 6

document.createElement('header'); document.createElement('nav'); document.createElement('article'); document.createElement('section'); document.createElement('aside'); document.createElement('footer');

 

스크립트도 크로스 브라우징 생각하면 IE와 다르게 사용해야하는 부분들도 많습니다만 여기서는 그 부분은 다루지 않겠습니다.
급하게 작성하는거라 틀린 부분이나 추가사항 코멘트 달아주시면 참고하도록 하겠습니다.