首页 文章

Css媒体查询无法在Chrome上使用Samsung S5

提问于
浏览
1

我正在开发一个响应式网站,只有当您使用PC访问该网站时才显示视频,但如果您使用的是手机,则会隐藏该视频 . 我用iPhone 5s / 6s,三星S4 mini检查了它,它完美运行(使用Safari / Internet / Chrome) . 当我尝试使用三星S5时,它的尺寸是三星s5屏幕的大小?如果你想查看该网站是http://objectfilms.altervista.org/

屏幕较小的移动设备的代码如下:

/* video background nascosto su Mobile phone */
@media only screen and (min-device-width : 200px) and (max-device-width : 720px) {
    .video-div { 
        visibility: hide;
        display: none;
    }
}

应该适用于Samsung S5的代码如下:

/* video background nascosto su Samsung S5 */
@media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) {
    .video-div { 
        visibility: hide;
        display: none;
    }
}

我能做什么?

1 回答

  • 0

    S5的分辨率为1080 x 1920,那些是设备像素,所以我认为你必须查询那些的值,比如

    @media screen and (device-width: 1080px) and (device-height: 1920px) and (-webkit-device-pixel-ratio: 3) { ...
    

    ...或使用常规像素值,但不是设备像素:

    @media screen and (width: 360px) and (height: 640px) and (-webkit-device-pixel-ratio: 3) { ...
    

相关问题