用于手持设备而不是小型浏览器屏幕的 CSS 媒体查询 [英] CSS media queries for handheld and not small browser screens

问题描述

在高分辨率手持设备的现代时代，是否可以仅使用 CSS 媒体查询而不是通过分辨率来检测手持设备?我不想像这里的其他一些问题一样只针对 iPad，我想确定我使用的是手持浏览器还是桌面浏览器，这样用户将在高分辨率平板电脑上看到移动 CSS 而不会看到移动布局如果他调整浏览器窗口的大小.仅使用 CSS 可以实现吗?

In the modern days of hi-resolution handhelds, is it possible to detect handheld with CSS media queries only and not by resolution? I don't want to target iPads only like some other questions here, I want to be sure if I'm using a handheld browser or a desktop browser so the user will see mobile CSS on hi-res tablets and will not see mobile layout if he resizes the browser window. Is that possible with CSS only?

推荐答案

你像这样使用它

@media handheld and (min-width: 700px) and (orientation: landscape) { ...  }

源:https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries

需要注意的是，不幸的是，许多掌上电脑"仍然没有选择这种类型，因此您必须单独解决这些问题.

To be noted, unfortunately many "handheld" still doesn't pick up that type so you will have to address those individually.

更多帮助:检测是否使用移动设备(iOS/Android 手机/平板电脑)中的浏览器

这篇关于用于手持设备而不是小型浏览器屏幕的 CSS 媒体查询的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！