如何在媒体查询中禁用CSS:hover？

我有一个悬停效果，我只想在视口的最小宽度为900px时触发。当视口变小时，我想禁用悬停效果

我该怎么做

PS：我正在使用Sass（SCSS），这可能会有帮助

这是我想禁用的：悬停效果的一个小片段。它用于缩放图像

img {
    display: table-cell;
    width: 100%;
    max-width: $painting-max-width;
    max-height: $painting-max-height;

    margin: auto;

    // zoom in animation transition
    transition: $painting-zoom-delay;
    transition-timing-function: cubic-bezier(0.25,0.46,0.45,0.94) 0s;

    &:hover {
        max-width: $painting-zoom-size;
        max-height: $painting-zoom-size;
    }

}

---

仅当视口的大小至少为

900px

宽时，才在mediaquery中插入

：hover

样式，因此以后无需还原样式

img {
    display: table-cell;
    width: 100%;
    max-width: $painting-max-width;
    max-height: $painting-max-height;

    margin: auto;

    // zoom in animation transition
    transition: $painting-zoom-delay;
    transition-timing-function: cubic-bezier(0.25,0.46,0.45,0.94) 0s;

    @media all and (min-width: 900px) {
        &:hover {
           max-width: $painting-zoom-size;
          max-height: $painting-zoom-size;
        }
    }

}

---

只有当屏幕宽度大于899px时，才能使用媒体查询启用具有胡佛效果的特定类：

@media (min-width: 900px) {
   img:hover {
      max-width: $painting-zoom-size;
      max-height: $painting-zoom-size;
   }
}

---

正常大小的悬停样式是什么？我添加了一个小代码段。这基本上是一个放大效应检查这个答案我想这是你想要的：