JQuery Mobile、Bootstrap 和 CSS3 媒体查询
使用什么组合
要拥有一个 UI 框架，我们都应该使用像 Bootstrap 这样的东西。 要为移动设备开发，我需要一些东西可以让在一个 HTML 文件中轻松切换页面，就像 JQuery Mobile (JQM) 所做的那样。 为了针对不同的屏幕宽度(iPhone、iPad 等)进行开发，我需要根据响应式网页设计规则进行开发。
根据 http://jquerymobile.com/test/docs/api/mediahelpers.html，JQM 不支持媒体查询它说助手类已被弃用。它指向媒体查询，除非您使用 Bootstrap 或 Skeleton，否则没有很好的例子
在寻找将 Bootstrap 与 JQM 相结合的信息时，除了在 JQM 中创建 Bootstrap 主题的 Andy Matthews 之外，没有很好的例子。 http://www.andymatthews.net/read/2012/02/13/New-jQuery-Mobile-theme:-Twitter-Bootstrap
那么，使用响应式网页设计开发 Web 应用程序的常见做法是什么？ 人们是忽略了 JQM(自己做 page-in-html 的东西)还是忽略了 Bootstrap(用 JQM 中的媒体查询手工做响应式网页设计)？
或者是否有一个全面的解决方案涵盖了 WebApp 开发的所有内容？ (请不要说 PhoneGap)
为清楚起见添加一些信息:我的 index.html header 中有以下几行:
<link rel="stylesheet" href="css/bootstrap.css" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
根据我的意见有点多？或者这是正确的吗？ 希望任何更有经验的 WebApp 开发人员都能对此有所了解。
谢谢，
最佳答案
当然，您可以让 boostrap 和 JQM css 一起很好地发挥作用。你拥有它的方式应该在大多数情况下都有效，除了一两个类被覆盖之外。如果你确实选择了这条路线，一定要制作一个自定义的 Bootstrap 构建，它只包含你打算使用的那部分 Bootstrap 。尽可能减少开销。
然而，使用 css3 媒体查询并不难。参加媒体查询的快速速成类(class)将节省您的用户带宽，并确保您的网站尽可能快地加载。
这里有一些关于使用 css3 媒体查询的很好的例子和教程:
http://css-tricks.com/css-media-queries/
http://webdesignerwall.com/tutorials/css3-media-queries
http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries/
关于css - JQuery Mobile、Bootstrap 和 CSS3 Media Queries，选择什么组合，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10759899/