我想制作我的网站的移动版本，但遇到了 jquery mobile。我在网上查看示例，我只看到这些网站复制了网站并将其放在服务器上的子域或 /mobile/ 目录中。我想只保留我网站的一种形式，这样我就不需要维护两个不同的网站。我有一个来自http://www.detectmobilebrowsers.com 的移动检测脚本，它可以检测移动站点，但我只想避免创建两个站点。是否可能只有一个网站可以兼作移动和桌面网站？谢谢，感谢您的帮助！
【问题讨论】：
标签： javascript jquery jquery-mobile mobile
使用 Bootstrap 3，它可以使用它的 css 媒体查询来做你想做的事。 或者，您可以简单地编写自己的 CSS 以使用媒体查询进行响应。
【讨论】：
正如 mccainz 所说，您有多种选择。所有这些示例都属于一个称为“响应式设计”的总称。
根据 维基百科，“响应式网页设计 (RWD) 是一种网页设计方法，旨在打造网站以提供最佳的浏览体验——轻松阅读和导航，只需最少的调整大小、平移和滚动——跨越各种设备（从手机到台式电脑显示器）”。
现在，在响应式设计方面有很多选择。要么使用现成的库，要么自己创建。
检查下面的链接，看看在调整浏览器大小时布局如何变化，以便获得最佳视图体验。
他们都有一个相同的想法：使用伟大而神圣的 CSS 将布局与真实代码解耦，让像你这样想要拥有相同代码库和不同视图体验的人不必重新编写代码。 CSS 的美妙之处就在这里。
另外，如果您认为上述库不符合您的要求，请编写您自己的响应式 CSS。为此，我强烈建议您查看以下两本书：
更新：由于您评论说要避免使用响应式布局，因此有少数人认为响应式布局不起作用，然后使用自适应方法。检查这出Why responsive layout does not worth it。作者解释了一些最小的优化点，并认为响应式布局在许多情况下都是矫枉过正的。他提供了诸如延迟加载之类的技术（在第 4 节下）。
其他资源：Alternatives to responsive design: part 1 (mobile) 再次讨论响应式布局的问题。
使用自适应方法，您可以决定什么是设备上的良好体验，并且您可以针对每种情况使用预编码布局进行一些优化，但通常没有经验法则。我想到的只是书。
也可以尝试流式布局。
【讨论】：