Я хотел бы предоставить отдельное поведение для браузеров, поддерживающих зависание (например, настольные браузеры), и браузеров, которые не поддерживают (например, устройства с сенсорным экраном). В частности, я хочу объявить состояние наведения в браузерах, которые его поддерживают, но не в браузерах, которые этого не делают, чтобы избежать того, чтобы мобильные браузеры эмулировали его с помощью дополнительных нажатий, поскольку это нарушает другие взаимодействия на странице - без определения наведения состояния для этих браузеров этого избегают.

Я прочитал оИнтерактивные медиа-запросы особенность, и, похоже, это должно сработать. Я мог бы сделать что-то вроде:

@media (hover: none) {
  /* behaviour for touch browsers */
}

В соответствии сМогу ли я использовать он доступен во всех браузерах, которые мне нужно поддерживать, кроме IE11 и Firefox.

Поэтому я подумал, смогу ли я сделать это наоборот - поскольку все основные сенсорные устройства поддерживают его, затем отрицаем его:

@media not (hover: none) {
  /* behaviour for desktop browsers */
}

Тем не менее, это, похоже, не работает вообще.

Пример псевдокода того, что я пытаюсь сделать:

.myelement {
  /* some styling */
  /* note: no hover state here */
}
@media(this device supports hover) {
  .myelement:hover {
    /* more styling */
  }
}

Итак, есть ли способ сделать эту работу так, как задумано, или я ошибаюсь?