仅使用媒体查询将悬停状态应用于桌面版（无平板电脑和手机）

Question

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

 div {    

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

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

   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;
            }
        }