Internet Explorer 특정 CSS 또는 Internet Explorer 특정 JavaScript 코드와 같은 특정 상황에서 Internet Explorer 10 만 대상으로 지정하려면 어떻게합니까?

160

Internet Explorer 특정 CSS 또는 Internet Explorer 특정 JavaScript 코드와 같은 특정 상황에서 Internet Explorer 10 만 대상으로 지정하려면 어떻게합니까?

나는 이것을 시도했지만 작동하지 않는다 :

<!--[if IE 10]>    <html class="no-js ie10" lang="en"> <![endif]-->
<!--[if !IE]><!--> <html lang="en" class="no-js"> <!--<![endif]-->

Internet Explorer 10은 조건부 주석을 무시하고 <html lang="en" class="no-js">대신을 사용합니다 <html class="no-js ie10" lang="en">.

javascript  html  css  internet-explorer-10  conditional-comments 
— trusktr
소스
8
더 좋은 질문은 다음과 같습니다.이 CSS를 두 브라우저에서 동일하게 보이게하려면 어떻게해야합니까?
— BentOnCoding
12
IE10 PP4는 여전히 @cc_on진술을 지원합니다 . 따라서 IE10이 지원되는지 여부를 감지하려면 다음 코드를 사용할 수 있습니다 <!--[if !IE]><!--><script>if(/*@cc_on!@*/false){document.documentElement.className+=' ie10';}</script><!--<![endif]-->. (IE가 아직 개발 중이기 때문에 이것을 주석으로 게시했습니다. 따라서 최종 릴리스에서도이 기능을 지원하는지 여부는 알 수 없습니다)
— Rob W
15
@RobW-ie11이 종료되면 예제 코드가 잘못됩니다. 개선 된 버전 : <script>if(Function('/*@cc_on return document.documentMode===10@*/')()){document.documentElement.className+=' ie10';}</script>개선 : 조건부 주석이 필요하지 않습니다. 주석 제거 압축 / 처리 중이라도 작동합니다. ie11에 추가 된 클래스가 없습니다. ie10 호환 모드에서 실행중인 ie11과 작동합니다. 독립형 스크립트 태그가 필요하지 않습니다 (다른 자바 스크립트에 추가 할 수 있음).
— robocat December
2
위의 코드의 예 : jsbin.com/upofoq/2
— robocat
8
보다 일반적인 해결책은 다음과 같습니다 if(document.documentMode) document.documentElement.className+=' ie'+document.documentMode+'mode';.-문제의 90 %를 해결합니다 (종종 호환 모드가 실패하는 경우 다른 수준의 수정이 필요함).
— robocat

답변:

65

아마도 다음과 같은 jQuery를 사용해 볼 수 있습니다.

if ($.browser.msie && $.browser.version === 10) {
  $("html").addClass("ie10");
}

이 방법을 사용하려면이 기능이 기본 jQuery 라이브러리에서 제거되었으므로 jQuery Migrate 라이브러리를 포함해야합니다.

나를 위해 아주 잘 운동했습니다. 그러나 조건부 주석을 대체 할 수는 없습니다!

— 맥스 소트
소스
3
나는 당신에 대해 확실하지 않지만 == '10.0'작동 하려면 그것을 사용해야 합니다
— lulalala
112
경고 : jQuery.browser플러그인 없이는 현재 버전의 jQuery (1.9)에서 더 이상 사용할 수 없습니다. blog.jquery.com/2013/01/15/…
— dave1010
2
권장 사항 : 이전 버전의 IE를 감지 if (jQuery.browser.msie && jQuery.browser.version < 10) { // do what you will here }하려면 verion <10 을 참고하십시오 . IE10 이상은 모든 CSS3, HTML5, jquery 등에서 잘 작동합니다.
— Dan Mantyla
1
@dan은 조건부 주석이 10 미만의 모든 IE 브라우저에서 작동하기 때문에 모든 브라우저에서 JS를 어지럽히는 대신 사용합니다. <!-[만일 IE 9 인 경우]라고 말하면 10 미만의 모든 IE 버전을 대상으로 지정할 수 있습니다. JS가 필요하지 않습니다.
— edhurtig
1
@ Marc-AndréLafortune은 좋은 지적을합니다. 경험상, 항상 ==가 아닌 === 연산자를 사용해야합니다. 자바 스크립트를 작성할 때이 점에 유의해야합니다. stackoverflow.com/questions/359494/…
— 스튜어트
132

스푸핑 될 수 있으므로 JavaScript navigator.userAgent또는 $ .browser (을 사용 navigator.userAgent) 를 사용 하지 않습니다 .

Internet Explorer 9, 10 및 11을 타겟팅하려면 (참고 : 최신 Chrome) :

@media screen and (min-width:0\0) { 
    /* Enter CSS here */
}

Internet Explorer 10을 대상으로하려면

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS here */
}

Edge Browser를 대상으로하려면

@supports (-ms-accelerator:true) {
  .selector { property:value; } 
}

출처 :

— 로니
소스
정말 좋습니다. 그러나 IE의 브라우저 모드에 대해 다양한 문서 모드를 테스트 할 때 얼마나 걱정해야합니까? 어떤 상황에서 온라인 사용자가 현재 브라우저 모드와 다른 문서 모드를 사용할 것으로 예상 할 수 있습니까?
— klewis
사람들은 일반적으로 문서 모드를 변경하지 않습니다. 그들은 할 수 있지만 사용자가 문서 모드를 변경 해야하는 사이트를 보지 못했습니다. 올바른 DOCTYPE을 사용하는 경우 전혀 문제가되지 않습니다.
— Roni
3
너는 나의 영웅이야! 그냥 참고, 이것은 또한 IE11에서 엉망이 몇 가지 물건 고정
— locrizak
8
이것은 IE11에도 영향을 미칩니다. 따라서 IE9 / 10만을 대상으로하는 솔루션을 찾고 있다면 작동하지 않습니다 :-(
— Lukasz Lenart
1
"모두 브라우저를 통해 브라우저를 감지하고 있습니다"는 무슨 뜻 navigator.userAgent입니까? 조건부 컴파일은 JScript 런타임의 기본 제공 기능으로, 사용자 에이전트 문자열을 통해 스푸핑 할 수 없습니다.
— BoltClock
111

이 사이트에서 누군가가 귀중한 의견을 가진 해결책을 찾았습니다 .

해결책은 다음과 같습니다.

if (Function('/*@cc_on return document.documentMode===10@*/')()){
    document.documentElement.className+=' ie10';
}

그것

  • 조건부 주석이 필요하지 않습니다.
  • 주석 제거 압축 / 처리 중이라도 작동합니다.
  • Internet Explorer 11에 추가 된 ie10 클래스가 없습니다.
  • Internet Explorer 10 호환 모드에서 실행되는 Internet Explorer 11에서 의도 한대로 작동 할 가능성이 높습니다.
  • 독립형 스크립트 태그가 필요하지 않습니다 (헤드의 다른 JavaScript 코드에 추가 할 수 있음).
  • 테스트하기 위해 jQuery가 필요하지 않습니다.
— 빌렘 드 위트
소스
3
@ dave1010 사용자 에이전트를 쉽게 스푸핑 할 수 있습니다. 조건부 주석은 JScript 엔진에서만 지원되며 IE4 +에서만 사용할 수 있습니다 (10 포함).
— Rob W
2
@ dave1010 설명하는 작업을 수행하는 작동하는 파서를 작성하는 것은 어렵고 거의 불가능합니다. 이러한 확장을 고의로 작성하여 설치하는 사람은 아마도 IE와 같이 행동 할 가능성이 높습니다 (아마도 Windows 환경이 아닌 환경에서 자동화 된 테스트 목적일까요?). 브라우저에서는 100 % 신뢰가 보장되지 않지만 충분히 가깝게 접근 할 수 있습니다. 조건부 주석은 IE에서 사용되는 JScript 엔진을 감지하는 매우 안정적인 방법입니다.
— Rob W
3
내가 볼 수있는 유일한 단점은 조건부에서하지 ​​않은 js가 필요하다는 것입니다.
— James Westgate
4
이것이 최고의 답변이되어야하며, JS 요구 사항은 IE10 사용자에게 도움이 될 것입니다. JS가 비활성화 된 경우 아마도 NoScript 애드온 일 것입니다. 우리는 AdScript 나 Ghostery와 같은 제정신 애드온과 달리 NoScript의 멍청함에 대해 더 많은 공공 교육이 필요하다고 생각합니다.
— iono
8
저자가 제공 한 대체 코드를 사용하는 것이 좋습니다.이 코드 if (/*@cc_on!@*/false && document.documentMode === 10) {}는 린트 프로그램의 평가 경고를 피합니다.
— ajbeaven
62

Internet Explorer 10은 더 이상 조건부 주석을 읽지 않습니다. 이것은 다른 브라우저와 마찬가지로 조건부 주석을 처리한다는 것을 의미합니다. 일반 HTML 주석과 같이 완전히 무시됩니다. 질문에 주어진 마크 업을 예로 들어 IE10을 포함한 모든 브라우저는 회색으로 강조 표시된 주석 부분을 완전히 무시합니다. HTML5 표준은 조건부 주석 구문을 언급하지 않았으므로 이것이 IE10에서 지원을 중단하기로 선택한 이유입니다.

그러나 주석 및 최신 답변에 표시된대로 JScript의 조건부 컴파일 은 여전히 ​​지원됩니다. 최종 릴리스에서는와 달리jQuery.browser 사라지지 않습니다 . 물론 사용자 에이전트 스니핑은 그 어느 때보 다 취약하기 때문에 어떠한 상황에서도 사용해서는 안된다는 것은 말할 나위도 없습니다.

실제로 IE10을 대상으로해야하는 경우 가까운 시일 내에 계속 지원 될 수있는 조건부 컴파일을 사용하거나 도움이되는 경우 브라우저 감지 대신 (또는 이와 함께) Modernizr 와 같은 기능 감지 라이브러리를 사용하십시오 . 유스 케이스에 서버 측에서 noscript 또는 IE10을 수용하지 않는 한 사용자 에이전트 스니핑은 실행 가능한 옵션보다 골치 아픈 일입니다.

사운드 꽤 복잡하지만 기억 오늘날의 웹 표준에 매우 준수의 현대적인 브라우저와 같은 일 이 매우 표준을 준수하는, 당신이되어 상호 운용 코드를 작성했습니다 가정, 안 절대적으로 필요하지 않는 한 IE10 따로 특별한 코드를 설정해야을, 즉, 동작 및 렌더링 측면에서 다른 브라우저와 유사해야합니다. 2 IE의 역사를 감안할 때 화려하게 들리지만 Firefox 또는 Chrome이 똑같은 방식으로 실망에 빠지기를 기대 한 횟수는 몇 번입니까?

당신이 경우에 할 정당한 이유가있는 모든 수단이 제공 한 다른 도구와 함께 그들을 냄새에 의해, 특정 브라우저를 대상으로한다. 나는 단지 당신이 오늘날의 이유보다 오늘날 그런 이유를 찾기가 훨씬 더 힘들다는 것을 말하고 있으며, 그것은 실제로 당신이 신뢰할 수있는 것이 아닙니다.

1 IE10뿐만 아니라 IE9, 심지어 IE8까지도 Chrome보다 훨씬 더 성숙한 CSS2.1 표준을 훨씬 잘 처리합니다. IE8은 표준 준수에 초점을 맞추기 때문에 (그 당시 CSS2.1은 이미 약간의 차이만으로도 꽤 안정적이었습니다) Chrome은 최첨단 의사 표준에 대한 반 광택 기술 데모에 지나지 않습니다.

2 내가 말할 때 나는 편견이 있을지 모르지만, 분명히 그렇게한다. 코드가 IE가 아닌 다른 브라우저에서 작동 하는 경우 IE10이 아닌 자체 코드에서 문제 가 될 가능성은 3 년 전에 이전 버전의 IE와 비교할 때 훨씬 낫습니다. 다시, 나는 편견이있을 수 있지만, 솔직하게 말하자 : 당신도 그렇지 않습니까? 당신의 의견을보십시오.

— BoltClock
소스
20
네, IE10은 여전히 ​​웹킷과 도마뱀보다 훨씬 뒤떨어져 있습니다. 나는 웹킷에서 멋지게 보이고 IE10에서 무시 무시한 CSS를 가지고 있습니다. 스타일을 선택적으로 적용하는 방법을 찾을 수 없으면 해당 스타일을 버려야합니다. :(
— trusktr
2
IE10에서는 조건부 주석이 HTML5 파서가 있으므로 제거되었습니다. HTML5 구문 분석 알고리즘에 따라 조건부 주석이 유효하지 않습니다. 유산을 참조 섹션 기능 blogs.msdn.com/b/ie/archive/2011/07/06/...
— 데이비드 스토리
3
@trusktr 코드를 잘 작성하면 모든 최신 브라우저에서 잘 보일 것입니다.
— Klevis Miho
10
@KlevisMiho 사실, 크롬과 파이어 폭스는 잘 코딩되어 있어도 IE에없는 기능을 지원합니다. "공통 기능 만 사용"을 의미하는 경우 "코드 잘 작성"과 동일하지 않습니다.
— trusktr
5
@ <!--[if !IE]><!-->stuff you don't want IE9 and below to see<!--<![endif]-->
— Dan
36

시작하기에 좋은 곳은 IE 표준 지원 문서 입니다.

자바 스크립트에서 IE10을 타겟팅하는 방법은 다음과 같습니다.

if ("onpropertychange" in document && !!window.matchMedia) {
...
}

CSS에서 IE10을 타겟팅하는 방법은 다음과 같습니다.

@media all and (-ms-high-contrast: none) {
...
}

IE11을 CSS를 통해 필터링하거나 재설정해야하는 경우 다른 질문을 참조하십시오. IE 11 용 CSS 핵을 작성하는 방법?

— 폴 스웨트
소스
5
CSS 솔루션은 IE11에도 영향을 미칩니다 : \
— Lukasz Lenart
11

여기에 게시 된 두 솔루션 (약간 수정)이 작동합니다.

<!--[if !IE]><!--><script>if(/*@cc_on!@*/false){document.documentElement.className='ie10';}</script><!--<![endif]-->

또는

<script>if(Function('/*@cc_on return 10===document.documentMode@*/')()){document.documentElement.className='ie10';}</script>

CSS 링크 앞에 html 페이지의 head 태그 안에 위의 행 중 하나를 포함시킵니다. 그리고 CSS 파일에서 "ie10"클래스를 부모로하는 스타일을 지정합니다 :

.ie10 .myclass1 { }

그리고 voilà! -다른 브라우저는 그대로 유지됩니다. 그리고 jQuery가 필요하지 않습니다. 내가 어떻게 구현했는지 예를 볼 수 있습니다 : http://kardash.net .

— 유진 카 다쉬
소스
11

나는 사용자 에이전트 스니핑과 달리 가짜가 될 수없는 간단한 방식으로 IE 10 (및 다른 모든 브라우저)을 탐지 할 수있는 Layout Engine 이라는 작은 바닐라 JavaScript 플러그인을 작성했습니다 .

렌더링 엔진 이름을 html 태그에 클래스로 추가하고 공급 업체 및 버전이 포함 된 JavaScript 객체를 반환합니다 (해당하는 경우).

내 블로그 게시물을 확인하십시오 : http://mattstow.com/layout-engine.html 그리고 GitHub에서 코드를 얻으십시오 : https://github.com/stowball/Layout-Engine

— 매트 스토우
소스
7

이 스크립트를 사용합니다.이 스크립트는 구식이지만 브라우저가 Internet Explorer 10 인 경우에만 포함 된 별도의 Internet Explorer 10 스타일 시트 또는 JavaScript 파일을 대상으로하는 데 효과적 입니다 (조건부 주석과 동일한 방식). jQuery 또는 다른 플러그인이 필요하지 않습니다.

<script>
    /*@cc_on
      @if (@_jscript_version == 10)
          document.write(' <link type= "text/css" rel="stylesheet" href="your-ie10-styles.css" />');
      @end
    @*/
</script >
— 데보라
소스
2
멋있는. @statements가 무엇인지에 대한 작은 정보를 추가 할 수 있습니까?
— trusktr
6

PHP를 사용하여 IE 10 용 스타일 시트를 추가 할 수 있습니다

처럼:

if (stripos($_SERVER['HTTP_USER_AGENT'], 'MSIE 10')) {
    <link rel="stylesheet" type="text/css" href="../ie10.css" />
}
— 레니 브루 잉크
소스
2
stripos는 대소 문자를 구분하지 않기 때문에 문자열을 상위로하는 것은 의미가 없습니다.)
— mgutt
2
나는 항상 이것을 유혹하지만 프론트 엔드에 cdn / cache / proxy가있을 때 중단된다는 것을 기억하십시오.
— Johan
5

이 작업을 수행해야하는 경우 JavaScript에서 사용자 에이전트 문자열을 확인할 수 있습니다.

var isIE10 = !!navigator.userAgent.match(/MSIE 10/);

다른 사람들이 언급했듯이 항상 기능 감지를 권장합니다.

— dave1010
소스
``!!`는 무엇입니까?
— Francisco Corrales Morales
4
String.match()일치하는 배열을 반환하거나 그렇지 않으면 null을 반환합니다. !(String.match())일치하면 false를 반환하고 일치하지 않으면 true를 반환합니다. !(!(String.match()))일치하면 true를, 일치하지 않으면 false를 반환합니다. !(!(something))또는 그냥 !!something아무것도 부울 true / false로 변환합니다. stackoverflow.com/questions/784929/…
— dave1010
@FranciscoCorralesMorales 오, 내가 코드를 조사 할 때 물어 본 횟수입니다. :) dave1010의 큰 논평으로의 확장으로서, 그것은 'truthy'또는 'falsy'값을 본질적인 boolean값 으로 강요하는데 사용될 수 있습니다 var name = 'me', hasName = !!name;.
— WynandB
4

Vanilla JavaScript로 IE 10을 대상으로하려면 CSS 속성 감지를 시도 할 수 있습니다. 

if (document.body.style.msTouchAction != undefined) {
  document.body.className = 'ie10';
}

CSS 속성

대신 msTouchAction이러한 CSS 속성 중 하나를 사용할 수도 있습니다. 이러한 속성은 현재 IE 10에서만 사용할 수 있기 때문입니다. 그러나 앞으로 변경 될 수 있습니다.

  • msTouchAction
  • msWrapFlow
  • msWrapMargin
  • msWrapThrough
  • msScrollLimit
  • msScrollLimitXMin
  • msScrollLimitYMin
  • msScrollLimitXMax
  • msScrollLimitYMax
  • msFlexbox
  • msFlex
  • msFlexOrder

테스트 페이지

내가 조립 한 테스트 페이지를 CodePen의 모든 속성.

— 팀 피에르 스키
소스
3

clipBoardData는 IE에서만 사용할 수있는 기능이므로 모든 IE 버전을 타겟팅하려는 경우 사용할 수 있습니다.

<script type="text/javascript">
if (window.clipboardData)
            alert("You are using IE!");
</script>
— 냐알 게르 데
소스
-1 : 그러나 버전은 어떻습니까? 어떤 버전인지 어떻게 알 수 있습니까?
— Francisco Corrales Morales
Edge 브라우저에는 "window.clipboardData"도 없습니다
— AFD
@AFD이 질문은 Edge가 아니라 IE에 관한 것입니다.
— TylerH
3

IE10 + 및 IE9 용 CSS

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ styles */
}

@media screen\0 {
    /* IE8,9,10 styles*/
}
— svnm
소스
1

기능 감지를 사용하여 브라우저가 IE10 이상인지 확인할 수 있습니다.

var isIE = false;
if (window.navigator.msPointerEnabled) {
    isIE = true;
}

> IE9 인 경우에만 true

— 조지 필리파 코스
소스
1

JavaScript로 :

if (/Trident/g.test(navigator.userAgent)) { // detect trident engine so IE
        document.getElementsByTagName('html')[0].className= 'no-js ie'; }

모든 IE에서 작동합니다.

IE08 => 'Trident/4.0'

IE09 => 'Trident/5.0'

IE10 => 'Trident/6.0'

IE11 => 'Trident/7.0'

변화에 따라서 /Trident/g의한 /Trident/x.0/g경우 x = 4, 5, 6또는 7(또는 어쩌면 8미래에 대한).

— 엔더 이벤트
소스
1

IE 탐지 버전을 추가하고 싶었습니다. http://james.padolsey.com/javascript/detect-ie-in-js-using-conditional-comments/ 에있는 스 니펫을 기반으로하며 ie10 및 ie11도 지원하도록 확장되었습니다. IE 5 ~ 11을 감지합니다.

어딘가에 추가하면 언제든지 간단한 상태로 확인할 수 있습니다. 전역 변수 isIE는 IE가 아닌 경우 정의되지 않거나 그렇지 않으면 버전 번호입니다. 그래서 당신은 쉽게 if (isIE && isIE < 10)또는 비슷한 것을 추가 할 수 있습니다 .

var isIe = (function(){
    if (!(window.ActiveXObject) && "ActiveXObject" in window) { return 11; /* IE11 */ }
    if (Function('/*@cc_on return /^10/.test(@_jscript_version) @*/')()) { return 10; /* IE10  */ }
    var undef,
        v = 3, div = document.createElement('div'), all = div.getElementsByTagName('i');
    while (
        div.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
            all[0]
        );
    return v > 4 ? v : undef;
}());
— 1 월
소스
0

나에게 다음 코드가 제대로 작동하면 모든 조건부 주석이 모든 IE 버전에서 작동합니다.

<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9"> <![endif]-->
<!--[if (gt IE 11)|!(IE)]><!--> <html> <!--<![endif]-->

<script>
    if (document.documentMode===10){
        document.documentElement.className+=' ie10';
    }
    else if (document.documentMode===11){
        document.documentElement.className+=' ie11';
    }
</script>

Windows 8.1에 있는데 ie11 업데이트와 관련이 있는지 확실하지 않습니다 ...

— 알렉스
소스
1
(gt IE 11)비트는 완전히 불필요합니다. <!--[if !(IE)]<!-->대신 할 수도 있습니다 .
— BoltClock
(gt IE 11)이 빠져 있고 사용자의 브라우저가 IE 12 인 경우 BoltClock은 (있는 경우) html 요소가 정의되지 않습니다.
— Leonardo Gonzalez
0

Internet Explorer 용 사용자 정의 CSS를 수행하는 방법은 다음과 같습니다.

내 JavaScript 파일에서 :

function isIE () {
      var myNav = navigator.userAgent.toLowerCase();
      return (myNav.indexOf('msie') != -1) ? parseInt(myNav.split('msie')[1]) : false;
}

jQuery(document).ready(function(){
    if(var_isIE){
            if(var_isIE == 10){
                jQuery("html").addClass("ie10");
            }
            if(var_isIE == 8){
                jQuery("html").addClass("ie8");
                // you can also call here some function to disable things that 
                //are not supported in IE, or override browser default styles.
            }
        }
    });

그런 다음 CSS 파일에서 서로 다른 스타일을 정의하십시오.

.ie10 .some-class span{
    .......
}
.ie8 .some-class span{
    .......
}
— 프란시스코 코랄 레스 모랄레스
소스
0

이 코드를 변환하기 위해 babel 또는 typescript를 사용하십시오.

const browser = () => {
    // "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3576.0 Safari/537.36"
    // "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/72.0.3626.17 Safari/537.36"
    // "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.140 Safari/537.36 Edge/18.17763"
    // "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:64.0) Gecko/20100101 Firefox/64.0"
    // "Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; rv:11.0) like Gecko"
    // "Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
    // "Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
    // "Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
    // "Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
    const _userAgent = navigator.userAgent;
    const br = {
        "Chrome": "Chrome",
        "Edge": "Edge",
        "Firefox": "Firefox",
        ".NET CLR": "Internet Explorer 11",
    };
    const nobr = {
        "MSIE 10.0": "Internet Explorer 10",
        "MSIE 9.0": "Internet Explorer 9",
        "MSIE 8.0": "Internet Explorer 8",
        "MSIE 7.0": "Internet Explorer 7"
    };
    let thisBrow = "Unknown";
    for (const keys in br) {
        if (br.hasOwnProperty(keys)) {
            if (_userAgent.includes(keys)) {

                thisBrow = br[keys];

                for (const key in nobr) {
                    if (_userAgent.includes(key)) {
                        thisBrow = nobr[key];
                    }
                }

            }
        }
    }

    return thisBrow;
};
스 니펫 확장

— Aliaksandr Shpak
소스
안녕하세요 Aliaksandr, 아이디어 주셔서 감사합니다! 왜 누군가가 다운 투표했는지 확실하지 않지만 답변이 적어도 유용한 힌트이기 때문에 나는 투표했습니다. 공감하는 사람이 있다면 새로운 사용자가 도움이되는 조언을하도록 도와주십시오.
— trusktr
-2

이 답변은 거기에 90 %의 길을 얻었습니다. Microsoft 사이트에서 나머지 답변을 찾았 습니다. .

아래 코드는 .ie 클래스를 추가하여 모든 대상을 타겟팅하는 데 사용하는 코드입니다. <html>

jQuery (1.9 이상의 사용자 에이전트를 위해 .browser를 사용하지 않음, http://api.jquery.com/jQuery.browser/ 참조 )를 사용하여 .ie 클래스를 추가 하십시오 .

// ie identifier
$(document).ready(function () {
  if (navigator.appName == 'Microsoft Internet Explorer') {
    $("html").addClass("ie");
  }
});
— 바 다닌
소스
"1.9 이상에서 사용자 에이전트를 선호하여 .browser를 더 이상 사용하지 않습니다." "사용자 에이전트를 선호하여"라고 말하지 않습니다. 즉, 기능 감지 에 유리 합니다 .
— BoltClock
-2

IE10 이상 및 IE 이외의 브라우저를 대상으로하지 않는다면이 조건부 주석을 사용할 수 있습니다.

<!--[if gt IE 9]><!--> Your code here. <!--<![endif]-->

http://www.paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-n 어느 쪽에서 파생 된

— 사용자 1003757
소스
1
나는 당신의 대답을 -1하지 않았지만 그 링크는 다소 여덟 것 같습니다 . OP가 IE10 및 IE10만을 대상으로한다는 점도 주목할 가치가 있습니다. 어쨌든, 조건부 주석은 IE5에서 IE9까지만 지원되므로 IE10 이상 또는 기타 비 IE 브라우저에서는 코드 스 니펫이 작동하지 않습니다.
— WynandB
-2

정말로 필요한 경우 다음 행을 추가하여 조건부 주석이 작동하도록 할 수 있습니다 <head>.

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

출처

— nyuszika7h
소스
-4

CSS를위한 현대적인 솔루션

html[data-useragent*='MSIE 10.0'] .any {
  your-style: here;
}
— 라파엘
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.