1、什么是bootstrap?
我们在开发前端页面的时候,如果每一个按钮、样式、处理浏览器兼容性的代码都要自己从零开始去写,那就太浪费时间了。所以我们需要一个框架,帮我们实现一个页面的基础部分和解决一些繁琐的细节,只要在它的基础上进行个性化定制就可以了。
Bootstrap 就是这样一个简洁、直观、强悍的前端开发框架,只要学习并遵守它的标准,即使是没有学过网页设计的开发者,也能做出很专业、美观的页面,极大地提高了工作效率。像Bootstrap中文网(https://www.bootstrap.cn)就是基于 Bootstrap 来开发的。
2、Bootstrap特点
移动端设备优先:自Bootstrap3起,框架包含了贯穿于整个库的移动设备优先的样式
响应式设计:采用栅格布局(底层实现原理:媒体查询结合流体布局)
偏UI,综合框架,包含一些常用的UI组件以及一些JS组件
3、为什么要学习Bootstrap
由于Bootstrap的普及率非常之高,至少在CSS UI库这个领域的地位是至今没有任何UI库可以撼动的。而且它本身就是基于CSS编写的,对于一个Web前端开发工程师来说Bootstrap是我们必须要学习了解的一个UI库。
现在市面上的UI库层出不穷,虽然很多UI库都已经上升到了框架级别(当然Bootstrap也被称作是“CSS框架”,但对于“框架”这个称呼业界一直存在争议),但是其CSS部分的设计的灵感基本都是来源于Bootstrap,如:ionic、mui、amazeUI、elementUI、sui、jQuery UI、bootmetro、flatUI等等,还远远不止这些,可谓是层出不穷,稍微知名的公司都希望自己开发出自己的各种框架,例如ElementUI就是“饿了么”旗下针对Vue进行二次封装开发的UI库和JS组件,网易也有自己的CSS框架NEC。
这么多CSS UI库或框架,你任意选出几款都会发现带着Bootstrap的影子,甚至还有一个叫“jQuery UI Bootstrap”的,则直接结合了jQuery UI和Bootstrap新层的一个UI库,在GitHub上也有5K星的人气。但这也只是一个缩影,可以说Bootstrap在UI库这类技术上有着重要的里程碑的作用。
就算是世界上精力最旺盛的人,也没有办法在“有生之年”去学习完这么多的UI库、JS框架和其它相关的各类技术,所以我们的学习应该是有重点的,并且学会去举一反三。对于Boostrap这样的UI库肯定是我们不应该错过的东西,也是我们去了解UI库这类技术的入门最佳选择。
4、如何学习Bootstrap
你可以在Bootstrap中文网(https://www.bootstrap.cn)找到大量的教程和中文手册。其实学习起来难度并不是很高。