html - 仅使用媒体查询将悬停状态应用于桌面版本(没有平板电脑和手机)

Question

我正在将悬停状态样式应用于这样的 div:

 div {    

     &:hover {
            color: red !important;
            border: 3px solid red !important;
        }
 }

现在，我不想将此 css 样式应用于 ipad 和其他平板电脑。所以，我添加了这样的媒体查询

   div {   

      @media only screen {

         &:hover {
                color: red !important;
                border: 3px solid red !important;
            }

        }
     }

这个我也试过

div {   

  @media not handheld {

     &:hover {
            color: red !important;
            border: 3px solid red !important;
        }

    }
 }

但是，悬停样式仍然适用于 ipad。我是媒体查询的新手。

知道如何使用 css/less/media 查询来实现这一目标吗？或者我在这里做错了什么？

谢谢!

Answer 1

感谢@Ashish 和@DOC ASAREL，设置 min-width 成功了。

这是解决方案:

@media (min-width: 1281px)  {
            &:hover {
                color: red !important;
                border: 3px solid red !important;
            }
        }