Media Queries CSS

问题

For some reason my media queries do not resize my site correctly when viewing from an iphone or mobile device, i get the tablet version of the site on an iphone. The media queries work fine for tablet and perfectly when shrinking a browser window.

Have I missed anything?

@media only screen and (min-width: 1024px) {
/*styling here*/
}

@media only screen and (max-width: 1023px) and (min-width: 740px) {
/*Tablet styling here*/
}

@media only screen and (max-width: 739px) and (min-width: 0px) {
/*Mobile styling here*/
}

回答1:

Check Out this, and let me know whether it is working or not

You need to specify device width.

回答2:

I think you may need to specify it as 'min-device-width'.

@media only screen and (max-device-width: 739px) and (min-device-width: 0px) {
    /*Mobile styling here*/
}

来源：https://stackoverflow.com/questions/11561035/media-queries-css