使用媒体查询定位平板电脑和移动设备

Question

我想在平板电脑和移动设备上隐藏页面上的特定元素。所以我用了：

@media (max-width: 991px) {
.popup_overlay {
    display:none !important;
}
}

当我从分辨率为 1920x1080 的手机打开网页时出现问题，并且元素出现但未正确显示，因为div 未针对小屏幕进行优化。

任何建议如何以正确的方式做到这一点？

Answer 1

您可以添加到媒体查询中，以定位具有最小分辨率和设备像素比率的非常高像素密度的手机和平板电脑。

在此处查看更多相关信息：http://css-tricks.com/snippets/css/retina-display-media-query/