检测设备（移动/电脑）并采取行动

Question

我想检测访问我网站的用户是使用手机还是PC，如果他使用的是PC代码应该加载特殊的css和html代码，否则代码应该加载不同的css和html代码（html和css都是对于同一文件中的两个设备） 为了检测设备，我检查了很多代码，但遗憾的是它们都只提供特殊手机（iphone，ipad，android，黑莓，Galaxy ......），我想要一个适用于整个手机的代码。
设备检测示例：

function DetectIphone()
{
   var uagent = navigator.userAgent.toLowerCase();
   if (uagent.search("iphone") > -1)
      alert('false');
   else
      alert('true');
}

此代码中的问题仅适用于iphone。

Answer 1

如果您之前使用过Twitter Bootstrap，您会发现他们使用@media来区分不同设备的css。此链接应该有所帮助，您不必编写自定义代码来确定设备类型。

http://www.w3schools.com/css/css_mediatypes.asp

Answer 2

您可以使用以下媒体查询：（这是CSS方式）

@media (max-width: 600px) {
  .selector {
    /* some style */
  }
}

此样式适用于max-width:600px的设备，您可以根据需要进行更改。

learn more here