본문 바로가기
Lecture/HTML

[스크랩] 버전별 explorer 적용법

by cusmaker 2012. 6. 28.
반응형

버전별 스타일시트 사용


 <!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]-->
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="ie8.css" />
<![endif]-->
<!--[if gte IE 8]>
<link rel="stylesheet" type="text/css" href="ie9.css" />
<![endif]-->
<!--[if !IE]><!-->
<link rel="stylesheet" type="text/css" href="default.css" />
 <!--<![endif]-->


  Internet Explorer Hacks


IE6 Only Hacks

* html input {
     padding:10px;
}


IE7 Only Hacks

*+html input {
     padding:10px;
}

IE8 Only Hacks

input {
     padding:10px\0/;
}


IE7 And IE8 Only Hacks

input {
     padding:10px\9;
}

Not IE7 Hacks

_input {
     padding:10px;
}

Conditional If Statement


<!--[if IE 6]>
     <html class="ie6">
<![endif]-->
<!--[if IE 7]>
     <html class="ie7">
<![endif]-->
<!--[if IE 8]>
     <html class="ie8">
<![endif]-->
<!--[if gte IE 8]>
        <html class="ie9">
<![endif]-->
<!--[if !IE]><!-->
        <html>
 <!--<![endif]-->

Change HTML Element With Javascript

<script type="text/javascript">
if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) { //test for MSIE x.x;
 var ieversion=new Number(RegExp.$1) // capture x.x portion and store as a number
 if (ieversion>=8)
     //For IE8
     document.getElementsByTagName('html')[0].className+='ie8';
 else if (ieversion>=7)
     //For IE7
     document.getElementsByTagName('html')[0].className+='ie7';
 else if (ieversion>=6)
     //For IE6
     document.getElementsByTagName('html')[0].className+='ie6';
}
</script>

use JQuery 

if ($.browser.msie) {
    if(parseInt($.browser.version) == 8){
         //For IE8
         $(“html”).addClass(“ie8″);
    } else if(parseInt($.browser.version) == 7){
         //For IE7
         $(“html”).addClass(“ie7″);
    } else if(parseInt($.browser.version) == 6){
         //For IE6
         $(“html”).addClass(“ie8″);
    }
}

출처 :  http://www.paulund.co.uk/use-different-styles-for-different-internet-explorer-versions

저작자표시

'Lecture > HTML' 카테고리의 다른 글

[본격 게시판짜기 Part1.2 - 게시판도 HTML부터] 글입력폼  (11) 2012.06.13
[본격 게시판짜기 Part1.1 - 게시판도 HTML부터] 게시글 리스트  (32) 2012.06.13
HTML 입문  (0) 2012.04.17

관련글

티스토리툴바