不同的风格取决于设备的宽度和高度

Question

我必须根据设备定义不同的textarea高度：

• 如果用户使用iPhone 4 ，则textarea的高度必须为62px，
• 如果用户使用iPhone 5 ，则textarea的高度必须为106px。

这是我目前的CSS。它适用于iPhone 5 ，但如果我在iPhone 4 上加载页面，它会使用为iPhone定义的样式 5 。< / p>

/* iPhone 2G-4S in portrait */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) 
and (orientation : portrait) {
    textarea {
        height: 62px;
    }
}

/* iPhone 5 & 5S in portrait */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : portrait) {
    textarea {
        height: 106px;
    }
}

为什么使用62px值在iPhone 4 中加载页面？