• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > 近期在尝试用bootstrap做移动端开发,发现了一些问题,这里写下自己的一些想法与疑问?

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

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含bootstrap,media,query,rem,200px等相关知识,匿名希望在学习及工作中可以帮助到您
首先对于移动端来说加载bootstrap的js css本身就比较笨重,再一个就是bootstrap本身对移动端布局的支持就比较局限,只是基于它自己的那套风格,比如一个div 你设置宽高都是200px,在不同屏幕下包括pc 它的宽高还是200px根本不会放大缩小,如果用rem那我干脆再加上media query 干嘛还要用bootstrap。bootstrap在移动端开发特别是精确的布局上面个人感觉还是存在很多问题。

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

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

回复内容:

你之所以有这些疑惑,可能是前端工程的经验不够以及对 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
看这里 --> http://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如何?

您可能想查找下面的文章:

  • 分享29个基于Bootstrap的HTML5响应式网页设计模板
  • Bootstrap 学习分享
  • BootStrap基本样式介绍
  • 解决Bootstrap只加载一次 remote 数据的问题
  • Bootstrap的优缺点是什么?
  • Bootstrap拟态框+支付宝首页
  • 详细介绍25+免费的Bootstrap HTML5网站模板图文详情
  • angularJS适不适合做互联网金融产品?
  • 怎么学习前端开发?求推荐学习路线??
  • 近期在尝试用bootstrap做移动端开发,发现了一些问题,这里写下自己的一些想法与疑问?

相关文章

  • 2018-12-03canvas画直角坐标系
  • 2018-12-03html5 Canvas画图教程(10)—把面拆成线条模拟出圆角矩形_html5教程技巧
  • 2018-12-03html5中布尔属性的hidden
  • 2018-12-03HTML5 Placeholder属性的详情介绍
  • 2018-12-03相同码率下,Ogg、MPEG 4、WebM这三种视频格式,哪种清晰度更高,为什么?
  • 2018-12-03画图工具如何使用?总结画图工具实例用法
  • 2018-12-03H5虚拟键盘挡住输入框怎么办
  • 2018-12-03怎样使用H5调用摄像头
  • 2018-12-03Vue.directive()的图文详解
  • 2018-12-03HTML5安全攻防详析之完结篇:HTML5对安全的改进

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • HTML5画布Canvas坐标轴转换、图案填充、渐变与阴影
    • 详解HTML5中ol标签的用法
    • H5怎样调用相机拍照并压缩图片
    • 用HTML5实现桌面提醒功能的一个实例代码
    • HTML5Canvas的讲解以及实例教程
    • HTML5和CSS3扁平化风格博客教程的资源分享
    • 推荐10个HTML5响应式框架
    • HTML5中的新元素介绍_html5教程技巧
    • 详细介绍HTML5 3D衣服摇摆动画特效如何实现
    • web开发的迷茫,希望有前辈能告诉一下方向?

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有