목차
IE 조건부 주석 정의
IE 조건부 주석 구문
주석 코드 기호 의미
IE 조건부 주석 예제
JS 조건부 주석
※ 주의: IE 10부터 조건부 주석 작동 X. ( IE버전 체크 함수는 위 링크 참조.)
IE 조건부 주석 정의
ie(익스플로러)에서만 해석해 실행 시키는 주석. (타 브라우저는 주석으로 인식해 실행시키지 않음)
※ 익스플로러 구 버전에서도 같은 화면을 구현 (=크로스 브라우징)하기 위한 조치.
※ IE 10 표준 모드 에서 조건부 주석은 지원되지 않고, JScript 조건부 주석은 지원.
IE 조건부 주석 구문
[방법1]
<!--[if 조건문]> 익스플로러에서 조건 맞을 경우 실행시킬 내용.<![endif]-->
[방법2]
<!--[if !IE]> --> 익스플로러가 브라우저가 아닌 경우 실행시킬 내용<!-- <![endif]-->
주석 코드 기호 의미
! (아니다)
lt (작다) ※ LT : L ess T han
lte (작거나 같다) ※ LTE : L ess T han or E qual
gt (크다) ※ GT : G reater T han
gte (크거나 같다) ※ GTE : G reater T han or E qual
() (우선처리),
& (그리고),
| (또는) ※ Shift키 + \키 함께 눌러 입력
IE 조건부 주석 예제
<!--[if ie 5]> IE 5일 경우 보일 내용 (homzzang.com) <![endif]-->
<!--[if ie 6]> IE 6일 경우 보일 내용 (homzzang.com) <![endif]-->
<!--[if ie 7]> IE 7일 경우 보일 내용 (homzzang.com) <![endif]-->
<!--[if ie 8]> IE 8일 경우 보일 내용 (homzzang.com) <![endif]-->
<!--[if ie 9]> IE 9일 경우 보일 내용 (homzzang.com) <![endif]-->
<!--[if ! ( ie 9)]> IE 9 아니라면 보일 내용 (homzzang.com) <![endif]-->
<!-- [if (gt ie 6)&(lt ie 9)] > ie 6 보다 높고 ie 9 보다는 낮다면 보일 내용 (homzzang.com) <![endif]-->
<!-- [if (ie 6)|(ie 9)] > ie 6 이거나 ie 9 라면 보일 내용 (homzzang.com) <![endif]-->
<!--[if lt ie 9]>
IE 9 보다 낮다면 보일 내용 (homzzang.com) <![endif]-->
<!--[if lte ie 9]> IE 9 보다 낮거나 같다면 보일 내용 (homzzang.com) <![endif]-->
<!--[if gte ie 9]> IE 9 이거나 높다면 보일 내용 (homzzang.com) <![endif]-->
<!--[if gt ie 9]> IE 9 보다 높다면 보일 내용 (homzzang.com) <![endif]-->
<!--[if gt ie 9]> <! --> IE9 보다 높은 경우 보일 내용 (주석 태그 살짝 다름)
<!--<![endif]-->
<!--[if ! ie ]>-->
IE가 아닌 경우 보일 내용 (주석 태그 살짝 다름) (homzzang.com)
<!-- <![endif]-->
<!--[if (gt IE 9)|!(IE)]> <! -->
IE9 보다 높거나 IE 아닌 경우 보일 내용 (주석 태그 살짝 다름)
<!-- <![endif]-->
PS1.
조건부 주석 라인을 아래처럼 붉은색 추가해 주석처리 시, ie 브라우저가 아닌 경우에만 non-ie.css 스타일시트를 적용 가능
<!--[if !ie ]>--> <link href="non-ie.css" rel="stylesheet"> <!-- <![endif]-->
PS2.
ie 9 보다 낮은 버전일 경우 <!--[if gt ie 9]>끝나자 마자 바로 출력 시작해 -->가 출력되므로,
출력되지 않도록 주석처리하기 위해 <! 를 넣어 주석처리한 것임.
<!--[if gt ie 9]> <! --> <link href="non-ie9.css" rel="stylesheet"> <!--<![endif]-->
<!--[if (gt IE 9)|!(IE)]> <! --> <link href="non-ie9.css" rel="stylesheet"> <!--<![endif]-->
<!--[if lt IE 7]> <html class="no-js lt-ie10 lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if IE 7]> <html class="no-js lt-ie10 lt-ie9 lt-ie8"><![endif]--> <!--[if IE 8]> <html class="no-js lt-ie10 lt-ie9"><![endif]--> <!--[if IE 9]> <html class="no-js lt-ie10"><![endif]-->
<!--[if gt IE 9]><!-->
<html class='no-js' prefix='og: http://ogp.me/ns#'>
<!--<![endif]--> <!--[if lte IE 9]>
<script>
window.onload = function(){
location.href ='이동될주소'
}
</script>
<![endif]-->
[참고]
JS 조건부 주석
/* */ : 자바스크립트 안에서 여러 줄 주석 처리
// : 자바스크립트 안에서 한 줄 주석 처리
@cc_on 은 조건부 주석의 시작 의미
@if , @elif , @else , @end 등의 조건문 이용 가능
@_jscript_version 브라우저에 내장된 자바스트립트 엔진 버전
@_win32 는 32비트인지를 나타냄.
PS. IE 전용 CSS 핵 - https://homzzang.com/b/css-338
주소 복사
랜덤 이동