如何将移动网站链接到我的电脑版网站

Question

我为朋友建立了一个网页，它在PC上看起来很棒，但是在设备上查看时，事情重叠并且看起来很糟糕。我为移动设备构建了一个更简单、响应更快的版本。如何编码以使从移动设备访问网站时出现移动版本？我在我的页面中使用html和css，filezilla作为ftp客户端。感谢您的任何帮助，我已经在网上研究了这个，但到处都发现了不同的答案，从来没有直接的答案。也许我没有正确问问题？

Answer 1

您应该使用媒体查询来定义要使用的 css。例如：

<link rel="stylesheet" media="(max-width: 800px)" href="mobile.css" />
<link rel="stylesheet" media="(max-width: 1800px)" href="computer.css" />

Answer 2

假设您希望从移动设备访问桌面站点自动重定向到移动站点，最简单的方法是使用 Javascript 进行操作

<script type="text/javascript">
if (screen.width <= 768) {
document.location = "YOUR-MOBILE-SITE.com";
}
</script>

它

通过检查浏览器页面宽度来工作，如果它低于 768px(通常移动用户宽度小于它(，它将重定向到您的移动网站。

或者，如果您只更改网站上的 CSS(没有激进的 html 更改(，而不是执行此类重定向，您可以使用编码样式表而不是重定向，因此它将在移动站点上加载您的移动优化 css 文件：

<!-- Desktop CSS File -->
<link rel="stylesheet" href="screen.css" media="screen"/> 
<!-- Mobile CSS File -->
<link rel="stylesheet" href="handheld.css" media="handheld"/>