css - 携帯電話用に別の 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 コードはありますか? メディアクエリに基づくことはできないと思います。

現在の投稿に基づいて解決策を見つけようとしていましたが、質問に対する明確な回答がなかったので、ここに投稿しました。

ありがとう