Как обнаружить браузеры IE и Edge в CSS?

Есть ли стандартный способ обнаружения IE и Edge браузеров в css? Я видел ответы для обнаружения в файле javascript, но я ищу его в css

Ответ 1

Для IE 9 и ниже загрузите условную таблицу стилей:

<!--[if IE]>
   <link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->

IE 10 и выше не поддерживает это, поэтому вы должны использовать медиа-запросы:

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

Для края 12-15:

@supports (-ms-accelerator:true) {
   /* Edge 12+ CSS */ 
}

EDIT

Для края 16+

@supports (-ms-ime-align:auto) {
    /* Edge 16+ CSS */ 
}

Ответ 2

Принятый ответ для Edge не работает в Edge 16.

Эта альтернатива работает:

@supports (-ms-ime-align:auto) {
    /* IE Edge 16+ CSS */ 
}

Через fooobar.com/questions/166221/...

(Добавление нового ответа, поскольку у меня нет привилегий для комментариев.)

Ответ 3

Не уверен насчет края, но для цели, т.е. 10/11, вы можете использовать:

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  //styles
}

Ответ 4

Для поддержки края 12+ и 16+ в качестве одного вкладыша

@supports (-ms-accelerator:true) or (-ms-ime-align:auto) {
     // your css here
}