响应式网页可以存在两个不同的html代码吗？

Question

这不是什么大问题，因为它有助于集思广益。至少在一个主题上，一个想法是否有效。现在，我知道CSS成像可以在页面碰到平板电脑大小的屏幕或iPhone大小的屏幕时帮助页面重塑。我的问题是，是否有办法在像素大小达到一定水平时设置两种完全不同的设计来工作？

Answer 1

您可以在CSS中执行以下操作：

@media (min-width:500px) { … }

但是，此方法存在固有的问题。如果用户侧向旋转手机，他们会收到不同版本的页面吗？如果用户只是简单地降低了分辨率（或者只有一台旧显示器），他们会使用其他版本吗？

根据我对您问题的理解，似乎您只是在试图检测某人何时在打电话，并为他们提供网站的移动版本？如果是这种情况，那么使用JavaScript会有更好的选择：

function mobileMode(){
var x= navigator.userAgent;
if (x.indexOf('Mobile')>=0){
    //Do mobile stuff here
}
else{
    //Or do desktop stuff here if need be
}

每个浏览器都会发送所谓的用户代理，使用该代理，您只需检查其用户代理中的“移动”一词即可检测某人是否在移动设备上。

这的另一个优点是，它允许电话中的某人请求该网站的桌面版本。

检测到查看页面的设备类型后，您甚至可以执行以下操作，例如将链接更改为针对移动用户的完全不同的CSS文件！