Question

的所有人。我做了一个网站，我只有iPhone的问题。我无法在这些设备上正常使用我的网站。我尝试了不同的解决方案，我们可以在stackoverflow上找到，如：

@media (device-height : 568px) 
   and (device-width : 320px) 
   and (-webkit-min-device-pixel-ratio: 2)

@media
    only screen and (max-device-width: 1136px) and (min-device-width: 960px) and (max-device-height: 640px) and (min-device-height: 560px),
    only screen and (max-device-height: 1136px) and (min-device-height: 960px) and (max-device-width: 640px) and (min-device-width: 560px) {
    /* iPhone only */
}

@media only screen 
    and (max-device-width: 640px), 
    only screen and (max-device-width: 667px), 
    only screen and (max-width: 480px)
{ }

但没有任何帮助我我对iphone和其他设备的疑问是如此

@media screen and (max-width: 420px), only screen and (max-device-width: 667px) and (-webkit-device-pixel-ratio: 2), screen and (min-device-width : 414px) and (max-device-height : 736px) and (max-resolution: 401dpi)
    .l-wrapper
        flex-direction: column
        .l-item
            width: 100%

    .projects
        figure.project
            width: 100%
            margin-right: 0

    .edu-places
        .edu-place
            span
                &.period
                    padding-top: 3em

                    &:before
                        top: 3em
    .h-wrapper
        flex-direction: column
        align-items: center

@media screen and (max-width: 768px), only screen and (max-device-width: 667px) and (-webkit-device-pixel-ratio: 2), screen and (min-device-width : 414px) and (max-device-height : 736px) and (max-resolution: 401dpi)
    #wrapper
        flex-direction: column

    #header
        flex: 1

    #main
        flex: 1

除了iPhone之外，它在我需要的任何地方都能正常工作。我该做什么？寻找你的帮助和建议。

iPhone的媒体查询

0 个答案: