Question

有没有人知道一个好的现代CSS黑客只针对iPhone和iPod Touch上的移动游戏？

我一直看到@media screen and (max-device-width: 480px)，但那是3年前的事，现在与Nexus S相提并论。

（这是为了解决一个微妙的布局问题。我发现浏览器嗅探是邪恶的等等。）

Answer 1

Answer 2

您可以使用only screen and (-webkit-min-device-pixel-ratio: 2)

Answer 3

你也可以要求-webkit-min-device-pixel-ratio: 2。我不相信有些浏览器目前报告任何高于2（虽然有些报告较低，因此使用最小比率） - 然而，这不包括iPhone 3GS和非视网膜iPod Touch设备。对于那些，你必须做一些用户代理嗅探。

Answer 4

定位Web上特定设备的唯一方法是检查用户代理字符串。所有Apple设备的名称都在用户代理字符串中。例如iphone将拥有“iphone”，ipod将拥有“ipod”。使用它来动态应用或加载css。

Answer 5

如果您只需要在手机上定位Safari，只需向此黑客添加媒体查询：

<div class='safari_only'> This div will have a padding:10px in a mobile with Safari  </div>

不要忘记将 .safari_only 类添加到要定位的元素中，例如：

String phoneState = intent.getStringExtra(Phone.STATE_KEY);
                mPhoneState = (Phone.State) Enum.valueOf(
                        Phone.State.class, phoneState);



public class PhoneState extends PhoneStateListener {

@Override
public void onCallStateChanged(int state, String incomingNumber) {
    switch (state) {
        case TelephonyManager.CALL_STATE_IDLE:
            //Some Action
            break;
        case TelephonyManager.CALL_STATE_OFFHOOK:
            break;
        case TelephonyManager.CALL_STATE_RINGING:
            //Some Action
            break;
        //case TelephonyManager.ANOTHER_STATE: ...
    }
    }
}

一个细节：这也将影响Android设备中的Safari浏览器，但无论如何......在Android设备中使用Safari：）

iPhone / iPod上的Mobile Safari攻击

5 个答案: