加載不同的手機CSS（但不適用於平板電腦）

Question

我需要爲手機加載不同的CSS樣式表，但不適用於平板電腦。我用以下解決方案過去：

<meta name="viewport" content="width=device-width, initial-scale=1"> 
<meta name="viewport" content="width=480"> 
<link rel="stylesheet" media="only screen and (max-width: 480px)"href="mobile.css" /> 
<link rel="stylesheet" media="only screen and (min-width: 481px)" href="desktop.css" /> 

或：

@media only screen and (max-width: 480px) { 
} 

，但兩者都基於屏幕分辨率。目前大多數的手機使用更高的分辨率，所以它不會工作，我想和這裏的原因是：片劑也將通過這部分的影響：

<meta name="viewport" content="width=480"> 

而且我想平板電腦像臺式機/筆記本電腦。

另外，我試圖做這樣說：

var IS_IPHONE = navigator.userAgent.match(/iPhone/i) != null; 
var IS_ANDROID = navigator.userAgent.match(/Android/i) != null; 

if(IS_IPHONE) ({ 
     url: href, 
     dataType: 'css', 
     success: function(){     
      $('<link rel="stylesheet" type="text/css" href="'+css/iphone.css+'" />').appendTo("head"); 
     } 
}); 

if(IS_ANDROID) ({ 
     url: href, 
     dataType: 'css', 
     success: function(){     
      $('<link rel="stylesheet" type="text/css" href="'+css/android.css+'" />').appendTo("head"); 
     } 
}); 

，但有這麼多不同的手機現在，我不能尋找每一個可能的設備，並將其添加一段時間一次。另外，現在Android也是平板電腦。

是否有GENERIC代碼檢測智能手機（不是平板電腦，只是手機）？ 我想它不能基於媒體查詢。

我試圖找到一個基於當前職位的解決方案，但沒有明確的答案在我的問題，所以我已經發布在這裏。

感謝

Answer 1

移動檢測是檢測設備的一個非常簡單而有效的PHP方法 - https://github.com/serbanghita/Mobile-Detect

簡單的說：

/ Include and instantiate the class. 
require_once 'Mobile_Detect.php'; 
$detect = new Mobile_Detect; 

// Any mobile device (phones or tablets). 
if ($detect->isMobile()) { 

} 

// Any tablet device. 
if($detect->isTablet()){ 

} 

// Exclude tablets. 
if($detect->isMobile() && !$detect->isTablet()){ 

} 

在您的版本和更新過程中您可以使用作曲家確保你有最新的Mobile_Detect版本。

composer require mobiledetect/mobiledetectlib 

{ 
    "require": { 
     "mobiledetect/mobiledetectlib": "^2.8" 
    } 
}