Я разрабатываю веб-приложение, и мне нужно идентифицировать браузер Microsoft Edge отдельно от других, чтобы применить уникальный стиль. Есть ли способ идентифицировать Edge с помощью CSS? Как,
<!--[if IE 11]>
Special instructions for IE 11 here
<![endif]-->
css
browser
microsoft-edge
Самира Лиянаге
источник
источник
Ответы:
/ * Microsoft Edge Browser 12-18 (все версии до Chromium) * /
Это должно работать:
@supports (-ms-ime-align:auto) { .selector { property: value; } }
Для получения дополнительной информации см .: Странность браузера.
источник
/* Microsoft Edge Browser 12-18 (All versions before Chromium) - one-liner method */ _:-ms-lang(x), _:-webkit-full-screen, .selector { property:value; }
Это прекрасно работает!
// for instance: _:-ms-lang(x), _:-webkit-full-screen, .headerClass { border: 1px solid brown; }
https://jeffclayton.wordpress.com/2015/04/07/css-hacks-for-windows-10-and-spartan-browser-preview/
источник
_:-ms-lang(x), _:-webkit-full-screen,
- только MS Edge "понимает" это правило, другие браузеры его игнорируют. За правилом следует имя класса или идентификатора элемента html, и оно применяется к нему. Другими словами, если код css необходимо применить только к элементу html в браузере Edge, укажите это специальное правило прямо перед классом / идентификатором вашего элемента.,
селекторы разделяются в CSS. вот почему это сбивает с толку. Я до сих пор не понимаю, почему другие браузеры игнорируют это, и только ms-edge применяет CSS к селектору после запятойБолее точно для Edge (не включая последнюю версию IE 15):
@supports (display:-ms-grid) { ... }
@supports (-ms-ime-align:auto) { ... }
работает для всех версий Edge (в настоящее время до IE15).источник
For Internet Explorer @media all and (-ms-high-contrast: none) { .banner-wrapper{ background: rgba(0, 0, 0, 0.16) } } For Edge @supports (-ms-ime-align:auto) { .banner-wrapper{ background: rgba(0, 0, 0, 0.16); } }
источник