移动检测或屏幕尺寸

Question

我想开始在我的一些网站上使用 jQuery mobile，以前我一直在使用媒体查询来检测屏幕尺寸并根据屏幕尺寸提供 css，但是我的一些客户使用移动版本会做得更好网站，意味着重定向到 mobile.website.com，而不是使用 css，这将允许我在某些情况下使用 jQuery mboile 进行更好的开发。 我的问题是最好的方法是什么，你必须检测用户代理还是只检测屏幕大小。 如果是这样，最好的方法是什么，我已经阅读了很多方法，但似乎没有任何标准。过去我使用脚本来检测移动设备，桌面 Mac 上的 Safari 浏览器也检测到了它，我在这方面的知识不是很好，所以我会很感激任何值得一读的文章或知识。

我注意到 Android 浏览器倾向于选择 768 及以下，而 iphone 选择 480 及以下，有时我发现我有 4 种不同的样式表，如果我可以检测到移动设备是否重定向到 url。适用于所有移动设备类型的解决方案的单一版本

坚持响应式设计和 CSS 会更好吗？ 在此先感谢任何 cmets

Answer 1

如果您正在开发一个仅支持移动设备的网站，最好使用 jQuery Mobile。如果您希望该网站同时在移动设备和台式机上运行，​​这不是一个好的选择。

jQuery Mobile 使用更多的流畅布局，确保您的网站在不同的屏幕尺寸上呈现良好。当您需要根据屏幕尺寸隐藏/显示信息时，响应式设计非常有用。

由于要求更侧重于检测屏幕尺寸而不是检测浏览器，因此最好采用响应式设计并使用媒体查询来支持移动设备和平板电脑。

Answer 2

您使用的是 ASP.NET MVC 吗？在这种情况下，要显示移动视图而不是 Web 视图，您所要做的就是复制您的常规视图并将 .Mobile 附加到它们，所以假设您的常规页面是 index.cshtml - 制作您所拥有的所有移动版本要做的就是复制它，名称是 index.mobile.cshtml，MVC 会为你处理它..

教程 - http://www.asp.net/mvc/tutorials/mvc-4/aspnet-mvc-4-mobile-features

现在，如果您不使用 MVC，而只是在做一个基本的 html/javascript 网站，那么您基本上需要依赖 css 媒体标签并基于此创建不同的标记。

Twitter bootstrap 是这样做的另一种选择，因为他们的 CSS 中几乎有开箱即用的响应式设计

http://getbootstrap.com/getting-started/