首先对于移动端来说加载bootstrap的js css本身就比较笨重，再一个就是bootstrap本身对移动端布局的支持就比较局限，只是基于它自己的那套风格，比如一个div 你设置宽高都是200px,在不同屏幕下包括pc 它的宽高还是200px根本不会放大缩小，如果用rem那我干脆再加上media query 干嘛还要用bootstrap。bootstrap在移动端开发特别是精确的布局上面个人感觉还是存在很多问题。最近兴起rem+media query 做移动端开发，我也做过一个项目用的这种方案，确实不错，在移动端开发页面布局兼容上确实比较好。而且轻量。bootstrap的响应式布局也是基于这种媒体查询的方案。感觉如果是纯粹的移动端开发是不是要放弃bootstrap，或者是bootstrap的重点不是在移动端，而是在pc
Bootstrap是个经典的响应式框架，但它不一定适合你的项目。你需要去改造它，或者和其他各种插件结合，甚至研究它的源码写出自己的更适合移动端的框架。移动端我觉得Frozen. js挺好的。
你之所以有这些疑惑，可能是前端工程的经验不够以及对 Bootstrap 的理解不够深。&br&&br&首先，我们来看你所认为的「笨重」。这是我刚刚下载的 bootstrap：&br&&div class=&highlight&&&pre&&code class=&language-text&&bootstrap.js - 68954
bootstrap.min.js - 36868
bootstrap.min.js.gz - 9781
bootstrap.css - 146082
bootstrap.min.css - 121260
bootstrap.min.css.gz - 19765
&/code&&/pre&&/div&&br&我们可以看到未压缩前的 JS 代码也不到 70KB，未压缩的 CSS 也不到 150KB。加起来不到 220KB 的东西，实际上只是 4G 网络中一秒不到的大小而已。&br&&br&当然，你觉得还是很大，那咱们 uglify 一下，再 gzip 一下呢？JS 文件只剩 10KB 不到，CSS 只剩 20KB 不到，加起来不到 30KB，这还是很笨重吗？&br&&br&再来看看你说设置 200px 之后它不会缩放，我觉得这就很蛋疼了，为什么你会觉得你设置了它是 200px 之后，还应该在小屏幕下变小呢？&br&&br&实际上，要在工程中使用 Bootstrap，不应该是使用它编译后的文件，而是使用它编译前的 less/sass 代码，然后通过修改它的变量，来达到自定义它的样式。并且，自己定义一套引入模块的代码，仅仅把你需要用到的模块引进来。&br&&br&并且，你说「精确的布局」实际上你可以自己通过上述的方式去定义一套样式，并且让你的设计师尽量按照你们的 UI 来设计，而不是追求那种不正常的「精确」。&br&&br&我们计蒜客上一版 UI 的底层就是 Bootstrap 的，Bootstrap 开源社区有人开发了一个叫 Bootflat 的 UI，我们在 Bootflat 上面再封装了一层适合我们使用的 UI，我们称为「JisuankeUI」：&br&&br&&img src=&/c42f3ba0c252bb_b.png& data-rawwidth=&1276& data-rawheight=&621& class=&origin_image zh-lightbox-thumb& width=&1276& data-original=&/c42f3ba0c252bb_r.png&&&br&&img src=&/a07e8a51747caeffab711_b.png& data-rawwidth=&1215& data-rawheight=&663& class=&origin_image zh-lightbox-thumb& width=&1215& data-original=&/a07e8a51747caeffab711_r.png&&&br&&img src=&/26be8f78f15f42a41135_b.png& data-rawwidth=&1068& data-rawheight=&694& class=&origin_image zh-lightbox-thumb& width=&1068& data-original=&/26be8f78f15f42a41135_r.png&&&img src=&/586cf52c241b68ed0209f49ebba6298b_b.png& data-rawwidth=&1054& data-rawheight=&659& class=&origin_image zh-lightbox-thumb& width=&1054& data-original=&/586cf52c241b68ed0209f49ebba6298b_r.png&&（备注：这是以前一位实习生写的，现在因为已不再使用了，所以没有人维护，不建议大家使用）&br&&br&虽然说现在提倡组件化，大家都玩 Vue、React 什么的了，Bootstrap 已经开始有点落后了。但是 Bootstrap 还是一套经典的 UI 框架，里面有很多东西值得去研究和挖掘的，要明白一个东西能流行这么多年，一定是有它的价值的。
你之所以有这些疑惑，可能是前端工程的经验不够以及对 Bootstrap 的理解不够深。首先，我们来看你所认为的「笨重」。这是我刚刚下载的 bootstrap：bootstrap.js - 68954
bootstrap.min.js - 36868
bootstrap.min.js.gz - 9781
bootstrap.css - 146082
题主……如果你长宽都设置成200px，如何期望它能有响应式变化……&br&Bootstrap提供了一套比较成熟的框架，并且拥有一些基础JavaScript功能：Alert，Tooltip和Collapse等等。总之用起来就是方便，建站也迅速。&br&至于Media Query……首先它不是最近兴起的; 其次确实，在Bootstrap3里也已经用到：&br&&a href=&///?target=http%3A///css/& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&CSS · Bootstrap&i class=&icon-external&&&/i&&/a& &-- 官网介绍&br&&br&那么为什么要用Bootstrap？&br&【1】方便&br&【2】方便&br&【3】确实方便&br&具体可以看这里 --& &a href=&///?target=http%3A///blog/item/42-71.html& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Bootstrap3正式版发布！&i class=&icon-external&&&/i&&/a&&br&就我个人感觉，如果题主追求样式的个性化。如果有专门的设计团队，那没问题；如果没有……我觉得你会想念Bootstrap&br&&br&如果不用Bootstrap，有没有替代品？&br&看这里 --& &a href=&///?target=http%3A///& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Ratchet&i class=&icon-external&&&/i&&/a&&br&看这里 --& &a href=&///?target=http%3A//purecss.io/& class=& external& target=&_blank& rel=&nofollow noreferrer&&&span class=&invisible&&http://&/span&&span class=&visible&&purecss.io/&/span&&span class=&invisible&&&/span&&i class=&icon-external&&&/i&&/a&&br&看这里 --& &a href=&///?target=http%3A///& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Foundation | The Most Advanced Responsive Front-end Framework from ZURB&i class=&icon-external&&&/i&&/a&&br&看这里 --& &a href=&///?target=http%3A//www.yaml.de/& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&YAML CSS Framework&i class=&icon-external&&&/i&&/a&&br&看这里 --& &a href=&///?target=http%3A///& class=& wrap external& target=&_blank& rel=&nofollow noreferrer&&Skeleton: Responsive CSS Boilerplate&i class=&icon-external&&&/i&&/a&
题主……如果你长宽都设置成200px，如何期望它能有响应式变化……Bootstrap提供了一套比较成熟的框架，并且拥有一些基础JavaScript功能：Alert，Tooltip和Collapse等等。总之用起来就是方便，建站也迅速。至于Media Query……首先它不是最近兴起的; 其次确…
已有帐号？
无法登录？
社交帐号登录
热衷于使用各种轮子移动端的Bootstrap到底怎么样_百度知道
移动端的Bootstrap到底怎么样
提问者采纳
我司一年前做手机版网站选型时Ratchet跟Bootstrap的差距 ＝ 中国足球跟德国战车的差距，在Ratchet、ionic，然后就杯具了、Framework7中选择了Ratchet（当时后两个还比较雏形）：更新慢
其他类似问题
为您推荐：
您可能关注的推广
bootstrap的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁热衷bootstrap的人开始醒醒吧！bootstrap与jquery mobile对比
[问题点数：20分，结帖人xiechengxiong]
热衷bootstrap的人开始醒醒吧！bootstrap与jquery mobile对比
[问题点数：20分，结帖人xiechengxiong]
不显示删除回复
显示所有回复
显示星级回复
显示得分回复
只显示楼主
2013年8月 Web 开发大版内专家分月排行榜第一2010年2月 Web 开发大版内专家分月排行榜第一
2013年7月 Web 开发大版内专家分月排行榜第二2013年6月 Web 开发大版内专家分月排行榜第二
本帖子已过去太久远了，不再提供回复功能。移动端的Bootstrap到底怎么样_百度知道
移动端的Bootstrap到底怎么样
提问者采纳
开发速度快&有大量第三方模板.bootcss://www：http。参考官网、组件&易于维护;在熟悉的情况下，它的移动优先的优势很明显快速制定一套团队编码规范&nbspbootstrap直接内嵌响应式布局现在移动应用满天飞的环境下
来自团队：
其他类似问题
为您推荐：
您可能关注的推广
bootstrap的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁2083人阅读
HTML5+CSS3（5）
本人之前已经使用Bootstrap有一段时间了，但是之前做出的网站都只是在电脑端使用，没有注意过手机端的显示效果。这两天自己使用Bootstrap做了一个简单的Web个人日志系统，想在手机端也使用，桌面端的效果勉勉强强，但是当用手机打开页面时，效果不忍直视。下面是其中一个界面的效果。
桌面浏览器查看效果：
手机浏览器查看效果：
问题一：字体非常的小，简直认不出来
于是我百度以及查看Bootstrap的文档，终于找到了解决方案：
可以参见Bootstrap中文文档中的原话：
只要在&header&中加上这句话，手机端看到的字体就会比较合理。看下面的效果图。
现在看起来效果好多了，文字能够非常清晰的显示出来。
问题二来了：上面的&ul&导航占了太多的空间，影响了核心内容的显示
我的导航是用以下代码实现的：
我想让”流水””总结”等4个导航链接排列在一行中，但又不想自己大改Bootstrap原来的CSS&(实际上自己也不是很熟练CSS)。于是我就想绕开CSS的细节技术，想到了在超小屏幕下不显示这个导航，转而实现一个简单的超链接列表。
上面的代码是在原来的&div&上应用了.hidden-xs样式，意思是超小屏幕下不显示该&div&。然后我又写了一个简单的&div&，包含4个导航链接，而这个&div&则应用了.hidden-sm.hidden-md&.hidden-lg&.hidden-print样式，表示只在超小屏幕下显示。
关于.hidden-?样式，可以在Bootstrap中文文档中看到这样一段画：
看应用代码之后的效果图。
嗯，这样的效果更加能够接受一些。
问题三又来了：两个箭头按钮和日期没有在一行上，而空间上明明够显示在一行
仔细检查我的代码并细致分析后，发现我使用的是.col-sm-4来为三个元素分配空间，当我把设置改为.col-xs-4时，一切都好了。
关于col-?-?可以在Bootstrap中文文档中找到相关说明：
Bootstrap v3本来就是一个移动为先的框架，可是我在使用的时候却丢弃了它的精髓，当作了一个简单的排版工具和组件皮肤使用。
从使用Bootstrap的一开始就应该考虑手机端的显示效果，使用col-xs-?&col-sm-?来为元素分配空间，最简单的情况就是只设置col-xs-?，因为更大的屏幕规则如果没有设置的画会继承小屏幕规格的设置。
还有，不要忘了加上&meta name=&viewport& content=&width=device-width,
initial-scale=1&&。
感觉还是学到了不少!
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：82614次
积分：1671
积分：1671
排名：第17096名
原创：87篇
评论：20条
(1)(2)(2)(13)(2)(5)(3)(8)(8)(5)(5)(1)(2)(2)(2)(2)(6)(1)(2)(1)(1)(1)(1)(1)(1)(3)(6)(4)(2)