如何检测用户是否使用 CSS 从手机 phone 浏览我的网站？

Question

我正在设计一个网站，允许用户搜索某个项目以显示相关信息，或者 select 使用下拉菜单搜索两个项目并比较两者。

我想做的是有两个独立的样式表可以加载；一种用于移动用户，另一种用于所有其他用户。我曾尝试寻找可能的解决方案，但 none 似乎完全符合我想做的事情。我担心如果我 select 一个基于屏幕分辨率的样式表，使用 1080p 显示屏的高端智能手机的用户将获得该站点的桌面版本。我想通过只向移动用户提供移动网站来避免这种情况，而不管屏幕分辨率如何。如果可能的话，我希望所有移动设备 OS 都使用 CSS 解决方案，以防万一用户禁用了 JavaScript。

Answer 1

你能试试这个吗

以下是判断用户是PC端还是手机端的方法：

<?php

/* Mobile detection */
function is_mobile() {
  $userAgent = strtolower($_SERVER['HTTP_USER_AGENT']);
  return strpos($userAgent, 'mobile');
}

/* Does the UA string indicate this is a mobile? */
if(!is_mobile()){
  $is_mobile = 'its pc';
} else {
  $is_mobile = 'Yes Mobile';
}

  echo '<pre>'; print_r($is_mobile);

?>

要克服设计问题，您可以使用 bootstrap

Answer 2

您可以在 css 中使用媒体标签。

@media only screen and (max-device-width: 480px) {
        div#wrapper {
            width: 400px;
        }

        div#header {
            background-image: url(media-queries-phone.jpg);
            height: 93px;
            position: relative;
        }

        div#header h1 {
            font-size: 140%;
        }

        #content {
            float: none;
            width: 100%;
        }

        #navigation {
            float:none;
            width: auto;
        }
    }

像这样，可以根据不同的屏幕尺寸定义不同的css。

您可以从这里获得参考：

如何检测用户是否使用 CSS 从手机 phone 浏览我的网站？

How can I detect if a user is browsing my site from a mobile phone using CSS?

css

mobile

responsive-design

web