0

0

近期在尝试用bootstrap做移动端开发,发现了一些问题,这里写下自己的一些想法与疑问?

php中文网

php中文网

发布时间:2016-06-07 08:42:34

|

3405人浏览过

|

来源于php中文网

原创

首先对于移动端来说加载bootstrap的js css本身就比较笨重,再一个就是bootstrap本身对移动端布局的支持就比较局限,只是基于它自己的那套风格,比如一个div 你设置宽高都是200px,在不同屏幕下包括pc 它的宽高还是200px根本不会放大缩小,如果用rem那我干脆再加上media query 干嘛还要用bootstrap。bootstrap在移动端开发特别是精确的布局上面个人感觉还是存在很多问题。

最近兴起rem+media query 做移动端开发,我也做过一个项目用的这种方案,确实不错,在移动端开发页面布局兼容上确实比较好。而且轻量。bootstrap的响应式布局也是基于这种媒体查询的方案。

感觉如果是纯粹的移动端开发是不是要放弃bootstrap,或者是bootstrap的重点不是在移动端,而是在pc

倍塔塞司
倍塔塞司

AI职业规划、AI职业测评、定制测评、AI工具等多样化职业类AI服务。

下载

回复内容:

你之所以有这些疑惑,可能是前端工程的经验不够以及对 Bootstrap 的理解不够深。

首先,我们来看你所认为的「笨重」。这是我刚刚下载的 bootstrap:
bootstrap.js - 68954
bootstrap.min.js - 36868
bootstrap.min.js.gz - 9781

bootstrap.css - 146082
bootstrap.min.css - 121260
bootstrap.min.css.gz - 19765
题主……如果你长宽都设置成200px,如何期望它能有响应式变化……
Bootstrap提供了一套比较成熟的框架,并且拥有一些基础JavaScript功能:Alert,Tooltip和Collapse等等。总之用起来就是方便,建站也迅速。
至于Media Query……首先它不是最近兴起的; 其次确实,在Bootstrap3里也已经用到:
CSS · Bootstrap
那么为什么要用Bootstrap?
【1】方便
【2】方便
【3】确实方便
具体可以看这里 --> Bootstrap3正式版发布!
就我个人感觉,如果题主追求样式的个性化。如果有专门的设计团队,那没问题;如果没有……我觉得你会想念Bootstrap

如果不用Bootstrap,有没有替代品?
看这里 --> Ratchet
看这里 --> purecss.io/
看这里 --> Foundation | The Most Advanced Responsive Front-end Framework from ZURB
看这里 --> YAML CSS Framework
看这里 --> Skeleton: Responsive CSS Boilerplate bootstrap3官网是写着优先移动端的,不过是在原先pc端的基础上进行优化的,是同时兼顾pc端的。因此如果是纯移动端,你可以对样式进行定制(Customize and download · Bootstrap),或者用其它框架。
如果你用rem布局,其实用不着bootstrap了,尤其是在对样式进行定制化时比较麻烦,我推荐是学习其中常用的css代码,抽离之后自己写个简易框架 我只会拿bootstrap的mixin来参考或用一下,其他的确实不太适合生拉硬套 你可知,真正的纯移动端大型应用,是没有人用bootstrap的。。。

如果你非要用框架,请用纯移动端的框架。 接收的好几个项目中有拿bootstrap的 ,结果拿过来狂覆盖,最先开始用的人不知道有个定制吗?????看着就烦人 Bootstrap是个经典的响应式框架,但它不一定适合你的项目。
你需要去改造它,或者和其他各种插件结合,甚至研究它的源码写出自己的更适合移动端的框架。
移动端我觉得Frozen. js挺好的。 bootstrap采用的是流式栅格式响应布局,这种栅格式布局方式本身就是为移动设备优先考虑,对于不同的设备栅格系统设置了不同的tag,如大型设备使用lg,中型md,小型xs等只需要简单配置即可实现响应式布局个人觉得十分优秀。对于移动端不适应的部分的存在,造成的主要原因是他的一些js组件太重手机浏览器并不能良好承载。另外建议手机页面最好不要确定具体宽度,最好调整viewport来控制页面的比例 bs刚出来的时候用过,感觉还挺方便,但后来完全没有一点兴趣,一是没必要用到所有的组件(虽然可以自定义选择组件,但是感觉还是不精简),二是全世界很多人都在用这套设计,有厌倦感,假如要基于bs去重新定义颜色或者更改设计,又很难跳出那个框。做技术类项目文档用bs我感觉还挺适合的,但是牵涉到一些需要有特色的,需要与众不同的就别用bs了,那个会有束缚的,况且自己弄个可响应的页面、组件又不难 Foundation如何?

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
go语言 注释编码
go语言 注释编码

本专题整合了go语言注释、注释规范等等内容,阅读专题下面的文章了解更多详细内容。

2

2026.01.31

go语言 math包
go语言 math包

本专题整合了go语言math包相关内容,阅读专题下面的文章了解更多详细内容。

1

2026.01.31

go语言输入函数
go语言输入函数

本专题整合了go语言输入相关教程内容,阅读专题下面的文章了解更多详细内容。

1

2026.01.31

golang 循环遍历
golang 循环遍历

本专题整合了golang循环遍历相关教程,阅读专题下面的文章了解更多详细内容。

0

2026.01.31

Golang人工智能合集
Golang人工智能合集

本专题整合了Golang人工智能相关内容,阅读专题下面的文章了解更多详细内容。

1

2026.01.31

2026赚钱平台入口大全
2026赚钱平台入口大全

2026年最新赚钱平台入口汇总,涵盖任务众包、内容创作、电商运营、技能变现等多类正规渠道,助你轻松开启副业增收之路。阅读专题下面的文章了解更多详细内容。

76

2026.01.31

高干文在线阅读网站大全
高干文在线阅读网站大全

汇集热门1v1高干文免费阅读资源,涵盖都市言情、京味大院、军旅高干等经典题材,情节紧凑、人物鲜明。阅读专题下面的文章了解更多详细内容。

73

2026.01.31

无需付费的漫画app大全
无需付费的漫画app大全

想找真正免费又无套路的漫画App?本合集精选多款永久免费、资源丰富、无广告干扰的优质漫画应用,涵盖国漫、日漫、韩漫及经典老番,满足各类阅读需求。阅读专题下面的文章了解更多详细内容。

67

2026.01.31

漫画免费在线观看地址大全
漫画免费在线观看地址大全

想找免费又资源丰富的漫画网站?本合集精选2025-2026年热门平台,涵盖国漫、日漫、韩漫等多类型作品,支持高清流畅阅读与离线缓存。阅读专题下面的文章了解更多详细内容。

19

2026.01.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.1万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 10万人学习

JS进阶与BootStrap学习
JS进阶与BootStrap学习

共39课时 | 3.2万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号