零，前言看着熟悉的Bootstrap3网站，想起去年刚来时艰难的学习过程，想想自己踩过的坑之前，情感。近期，球队吸纳了新鲜血液。本着世代相传的原则，为了防止后面的人重蹈覆辙，特发此篇介绍性文章。回想自己在学习的时候，最大的问题就是看不懂文档，也就是所谓的抓瞎。看着一堆字，却不知道哪些内容重要，最后浪费了很多时间。所以这篇文章，除了介绍Bootstrap，最重要的是：让初学者了解学习一门新技术的具体过程。推荐阅读：Bootstrap3官网：https://v3.bootcss.com/菜鸟教程：https://www.runoob.com/bootst...1、HTML、CSS、JS的关系HTML是骨架CSSistheclothesJSmakes这三句话让网页动起来。在座的各位都听过N遍了，但是对于没见过CSS和JS的朋友来说，无异于给牛弹琴。不管老师强调多少遍，学生都记不住。即使他们记住了，他们也会死记硬背。所以，直接上图：纯HTML很简单，只有内容，根本没有样式：加了CSS，穿上衣服，最直观的感受就是页面变美了：加JavaScriptJS，让网页动起来，包括滚动和轮播图片，弹窗等等，都是JS的功能。所以看到这里，大家应该对三者之间的分工有了一个清晰的认识。三者是一个整体。所有的网页内容都依赖于HTML来完成基本的布局。CSS丰富了页面的样式，增加了网页的美感。JS负责与用户交互，接收用户点击，并做出相应的响应。二、框架？想象一下，你被要求去挖土。可以选择用铲子挖土，但需要一个月的时间才能挖好；但你也可以选择使用挖掘机！用挖掘机只需要一个小时。因此，手写代码就像用铲子挖一样。虽然一步步往下走，但效率低下；而使用框架就像一台挖掘机，可以在实际生产中快速帮助你搭建项目。最终，铲子和挖掘机都能完成任务，区别是一样的。最大的区别是效率。所以在实际的生产项目中，有一个很重要的思想：不要重复别人已经写好的完美代码，当然我们也不需要再写一遍，直接拿来用就行了。因此，出现了各种高效便捷的框架。用户只需要拿着框架，修改成自己需要的。（这是面向复制粘贴的编程）BootstrapBootstrap是什么我就不说了，因为讲了也没用——根本记不住，也没必要记。通俗点说，有个大神给你写了很多CSS样式和JS效果，放在一个文件里。我们在使用的时候只需要导入这个文件就可以得到师傅写的所有样式，不需要再自己写了。有了Bootstrap，我们甚至不需要CSS和JS，只需要熟悉HTML，只需要复制粘贴就可以创建漂亮的页面。3、开始终于到了本文的核心内容：学习一门新技术的过程是怎样的？如果是学习理论知识，首先要了解的是“它是什么”和“它的定义”。但显然，计算机不属于理论知识，它是一门非常非常实用的学科，我们不需要在理论层面浪费太多精力，而应该关注“它能实现什么”和“如何使用”它”！因此，即使你不知道它的定义，甚至不知道它的名字，只要你知道如何使用它，并用它做出优秀的作品，那么你就是一个优秀的程序员。打开Bootstrap3文档，看着这一堆文字和代码，你的脑海里肯定会冒出一个问题：这个TM在说什么？如果你没有任何阅读文档的经验，那么第一次看到这么多字，你会一头雾水，这很正常。这是初学者的坑——不知道如何迈出第一步，往往会在这里浪费很多时间。那么，如果我们是第一次阅读官方文档，应该重点关注什么呢？是的，“它能达到什么目的”！“它能实现什么”如果事先告诉你，进入这个网页后，不看任何代码和文字，只看图片，只看各种按钮、输入框、标题、巨屏等，会你还像以前一样迷茫吗？这些图片就是Bootstrap可以实现的功能。因此，学习的第一步就是反复看这些图片。即使我们什么都不知道，至少我们知道“我能实现”并不断思考：我需要的功能，它能实现吗？——这是需求分析。《我如何实现》在学习任何一种编程语言之前，都需要安装环境。比如学习C++需要安装VC6.0，学习Python需要安装Python3.7和文本编辑器，学习HTML需要安装XAMPP或者NodeJS，所以安装环境就成了学习语言的第一步。“连环境安装都不会，还写什么程序？”所以在知道了某个框架可以实现什么功能之后，接下来就是思考“我怎样才能在我的电脑上运行它”。打开安装环境的起始页后，你肯定又一头雾水了。其实文档针对不同的人群给出了不同的安装方法（虽然对于新手来说似乎很难）。我们必须学会在海量内容中压缩信息。所以你需要记住一件事：任何文档，只要涉及难以理解的内容，就必然要给出模板，必然要给出模板，必然要给出模板。所以我们不需要看这些看不懂的东西：只要向下滚动，直到在这里找到“基本模板”：将所有代码粘贴到一个空文件中，保存，用浏览器打开，当你看到：Congratulations，成功运行Bootstrap！这是最简单的安装方法！就这么简单！就像复制它一样简单！复制粘贴既然环境已经安装成功，我们离实现各种效果又近了一步，接下来就是如何实现了。再次打开组件页面，随意选择一个功能，比如“按钮”：将其所有代码复制到刚刚显示“Hello,world”的模板中，保存，刷新浏览器，就可以看到刚才的组件，出现生动地呈现在您自己的网页中。其他组件同理，??复制自己需要的即可！当你获取到模板中的各种组件后，你只需要修改里面的文字，就可以将它们改成你想要的样子。至此，我们已经实现了大部分功能！4.进阶学习更换模板后，我们可以快速搭建一个像样的网页，但是我们无法准确排版网页，所以需要容器和网格。容器回退到全局CSS样式，找到布局容器并读取它。由此我们知道：用一个div作为容器，把所有的组件都放在容器里。//这样的容器会在网页左右两边留出空间，网页整体居中
