css – 媒体查询平板电脑最小分辨率和最大分辨率

前端之家收集整理的这篇文章主要介绍了css – 媒体查询平板电脑最小分辨率和最大分辨率前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
目前正在开发响应式设计网站.我使用媒体查询根据宽度和屏幕分辨率定位不同的设备.

>我有一个场景,我想使用屏幕分辨率来定位设备,但我不明白这是如何工作的.
>我想检查最小宽度和最大宽度,屏幕分辨率也可以从97dpi到ipad最大分辨率264dpi.但这似乎不起作用.如果我为hp加载的平板电脑提供单一分辨率最小宽度:155dpi它可以工作.但最小到最大分辨率条件似乎不起作用.你们能分享一下你的想法吗?

为此,我使用了类似下面的代码

@media only screen and (min-width:768px) 
and (max-width:1024px) and (min-resolution:96dpi) and (max-resolution:264dpi){

解决方法

分辨率媒体查询 doesn’t have good support in webkit browsers yet,因此您可以使用设备像素比率获得更多成功.

http://bjango.com/articles/min-device-pixel-ratio/

因此,我们可以使用分辨率为您理解它的浏览器(Firefox,IE9,Opera)以及所有webkit(Chrome,Safari,iOS和Android)的设备像素比率重新设置媒体查询

@media only screen and (min-resolution:96dpi) and (max-resolution:264dpi) and (min-width:768px) and (max-width:1024px),only screen and (-webkit-min-device-pixel-ratio: 1) and (-webkit-max-device-pixel-ratio:2) and (min-width:768px) and (max-width:1024px) {}

猜你在找的CSS相关文章