Я разрабатываю веб-приложение, и мне нужно идентифицировать браузер Microsoft Edge отдельно от других, чтобы применить уникальный стиль. Есть ли способ идентифицировать Edge с помощью CSS? Точно так же,
<!--[if IE 11]>
Special instructions for IE 11 here
<![endif]-->
Это должно работать:
@supports (-ms-ime-align:auto) {
.selector {
property: value;
}
}
Подробнее см. Странность браузера
/* Microsoft Edge Browser 12+ (All) - 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/
Обнаружение функций, обнаружение функций, обнаружение функций. Еще предстоит найти хороший вариант использования того, почему кому-то нужно UA анализировать или обнаруживать с помощью CSS. Не могли бы вы объяснить немного подробнее, случай использования?
CSS
Я нашел этот пост от Джеффа Клэйтона, который иллюстрирует, как найти Edge с помощью CSS, но он также обнаружит Chrome и Safari.
/* Chrome, Safari, AND NOW ALSO the Windows 10 Edge Browser */
@media screen and (-webkit-min-device-pixel-ratio:0) {
.selector { property:value; }
}
Но если вы ДОЛЖНЫ UA нюхать
Microsoft Edge UA строка:
Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, как Gecko) Chrome/42.0.2311.135 Safari/537.36 Edge/12.10136
Я подробно описываю, почему в этом блоге.
Neowin недавно сообщил, что новый браузер Microsoft для Windows 10, Spartan, использует строку Chrome UA "Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, как Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0 ″. Это сделано специально.
Вы также заметите, что вся строка оканчивается на "Edge/12.0", чего нет в Chrome.
Я должен отметить, что это не является редким отклонением от того, что Microsoft сделала с IE 11, который в Windows 8 гласит: Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv: 11.0), как Gecko, как объяснено в этом посте.
Что такое агент пользователя?
Часто веб-разработчики используют UA для обнаружения браузера. Mozilla хорошо объясняет это в своем блоге:
Обслуживание разных веб-страниц или сервисов в разных браузерах обычно является плохой идеей. Интернет должен быть доступен каждому, независимо от того, какой браузер или устройство они используют. Есть способы разработать свой веб-сайт, чтобы постепенно улучшать его, основываясь на доступности функций, а не нацеливаясь на конкретные браузеры.
Вот отличная статья, объясняющая историю User Agent.
Зачастую ленивые разработчики просто отыскивают строку UA и отключают контент на своем веб-сайте в зависимости от того, какой браузер, по их мнению, использует зритель. Internet Explorer 8 - это общая проблема для разработчиков, поэтому они часто проверяют, использует ли пользователь ЛЮБУЮ версию IE, и отключают функции.
Команда Edge подробно рассказывает об этом в своем блоге.
Все строки пользовательских агентов содержат больше информации о других браузерах, чем фактический браузер, который вы используете - не только токены, но и "значимые номера версий".
Строка UA Internet Explorer 11s:
Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv: 11.0), как Gecko
Microsoft Edge UA строка:
Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, как Gecko) Chrome/42.0.2311.135 Safari/537.36 Edge/12.10136
Патрик Х. Лауке в обсуждениях W3C метко описал свойство userAgent как "постоянно растущую пачку лжи". ("или, скорее, уравновешивающий процесс добавления достаточного количества унаследованных ключевых слов, которые сразу же не приводят к падению старого UA-сниффинг-кода, все еще пытаясь передать немного действительно полезной и точной информации".)
Мы рекомендуем, чтобы веб-разработчики максимально избегали прослушивания UA; функции современных веб-платформ обнаруживаются практически всеми способами. За прошедший год мы видели несколько сайтов, отслеживающих UA, которые были обновлены для обнаружения Microsoft Edge… только для того, чтобы предоставить ему устаревший путь кода IE11. Это не лучший подход, поскольку Microsoft Edge соответствует поведению WebKit, а не IE11 (любые различия Edge-WebKit - это ошибки, которые были заинтересованы в исправлении).
По нашему опыту, Microsoft Edge лучше всего работает на путях кода WebKit на этих сайтах. Кроме того, в связи с тем, что Интернет становится доступным на более широком спектре устройств, пожалуйста, предположите, что неизвестные браузеры хороши - пожалуйста, не ограничивайте свой сайт работой только в небольшом наборе известных браузеров. Если вы сделаете это, ваш сайт почти наверняка сломается в будущем.
Заключение
Представляя строку Chrome UA, мы можем обойти хаки, которые используют эти разработчики, чтобы предоставить пользователям лучший опыт.
Более точным для Edge (не включая последнюю версию IE 15) является:
@supports (display:-ms-grid) { ... }
@supports (-ms-ime-align:auto) {... } работает для всех версий Edge (в настоящее время до IE15).