Html 在不使用媒体查询的情况下瞄准平板电脑

我只是想知道，是否有可能不使用媒体查询就瞄准平板电脑。我问这个问题的原因是，我已经在使用媒体查询，但我的桌面上有灰度图像，当鼠标悬停时，它们会变为原始颜色。我已经移除了当设备达到一定尺寸时的灰度，这样在较小的平板电脑和手机上就可以了，但对于ipad和某些平板电脑来说，当它们被美化时，它就有点太小了

有没有办法让平板电脑在不接触媒体查询的情况下关闭过滤器

提前谢谢

---

讨论中的网站是

看看移动ESP框架；特别是JavaScript。它可以检测单个设备或设备组，如平板电脑

与您想要实现的目标最相关的方法是：

MobileEsp.DetectTierTablet();

它还允许您按操作系统选择特定的平板电脑组：

MobileEsp.DetectAndroidTablet();
MobileEsp.DetectWebOSTablet();
MobileEsp.DetectIpad();
MobileEsp.DetectMaemoTablet();
MobileEsp.DetectBlackBerryTablet();
MobileEsp.DetectOperaAndroidTablet();

一种可能的使用场景：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://www.hand-interactive.com/js/mdetect.js"></script>
<script>
    $(function() {

        if(MobileEsp.DetectTierTablet()) { // if its a tablet this will be true

            $("html").addClass("isTablet"); // this will add the isTablet class to the HTML element

        }    
    });
<script>

$（函数（）{
如果（MobileEsp.detectTablet（））{//如果是平板电脑，则为真
$（“html”）.addClass（“isTablet”）；//这将把isTablet类添加到html元素中
}    
});

上面的示例使用，如果您开始使用JavaScript，这将使事情变得更容易。有了它，您只需在样式表中为平板电脑设置如下规则：

<style>
    body {
        max-width: 1200px;
    }
    .isTablet body {
        max-width: 100%;
    }
</style>

身体{
最大宽度：1200px；
}
.IStable主体{
最大宽度：100%；
}

它还有ASP.NET和PHP的其他版本，因此您可以在服务器端执行检测

下面是一把小提琴，它演示了上述功能：

---

我知道您不想触碰媒体查询，但据我所知，您的问题可以通过以下方式解决：

@media（方向：横向）{…}

你想确定这是否是一个景观，对吗

关于媒体查询的其他用法

如果你真的不想碰它，还有一个选择就是使用javascript。但我认为这会使事情变得更复杂

---

希望我的回答能有所帮助：）

好的，谢谢，我会看一看，虽然我对javascript是一个完全的新手，所以我很可能会问更多关于这方面的问题。网站上有很多使用场景，你可以复制和粘贴。基本上，您可以在“iTablet”页面的HTML元素上设置一个CSS类，然后在任何特定于tablet的样式前面加上该类。因此，例如，它可以是.iTablet.grayscale{filter:none；}，而不是.iTablet body{max width:100%；}。这样行吗？我尝试了我上面所做的，但不起作用，你现在可以在网站上看到代码了。我没有下载MobileESP，只是将链接放在脚本src中。我有一种感觉是不对的，我可能需要为它制作一个.js页面？但是我看了看你的提琴，你所做的只是使用了我使用的链接，当我把它放在提琴（）中时，它实际上起作用了，这很奇怪，所以我一定是把代码弄错了？？