Я розробляю веб-додаток, і мені потрібно визначити браузер Microsoft Edge окремо від інших, щоб застосувати унікальний стиль. Чи є спосіб ідентифікувати Edge за допомогою CSS? Так як,
<!--[if IE 11]>
Special instructions for IE 11 here
<![endif]-->
Я розробляю веб-додаток, і мені потрібно визначити браузер Microsoft Edge окремо від інших, щоб застосувати унікальний стиль. Чи є спосіб ідентифікувати Edge за допомогою CSS? Так як,
<!--[if IE 11]>
Special instructions for IE 11 here
<![endif]-->
Відповіді:
/ * 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 до селектора після коми
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);
}
}