可以保证您在一小时内上手Bootstrap UI框架，您所在的团队是否即将使用Bootstrap，而您却从来没有接触过该框架，那么这一小时的视频将对您有很大的帮助。

如果你想了解Bootstrap，那你的前提得需要懂一点HTML/CSS/JavaScript，不需要懂太多。

Bootstrap是美国Twitter公司的设计师Mark Otto和Jacob Thornton合作基于HTML、CSS、JavaScript开发的简洁、直观、强悍的前端开发框架，使得Web开发更加快捷。Bootstrap提供了优雅的HTML和CSS规范，它即是由动态CSS语言Less写成。Bootstrap一经推出后颇受欢迎，一直是GitHub上的热门开源项目，包括NASA的MSNBC（微软全国广播公司）的Breaking News都使用了该项目。国内一些移动开发者较为熟悉的框架，如WeX5前端开源框架等，也是基于Bootstrap源码进行性能优化而来。

视频教程目录：

章 Bootstrap3概述

1-1 Bootstrap概述 1-2 Bootstrap下载 1-3 使用Bootstrap实现什么效果的案例 1-4 HBuilderX开发工具的介绍

第二章 Bootstrap3实践

2-1 将Bootstrap3和jQuery的库文件放到项目当中 2-2 在代码中引入jquery和bootstrap的库 2-3 使用Bootstrap的页头组件实现会员列表的页头信息 2-4 使用Bootstrap实现新增修改删除按钮 2-5 使用Bootstrap实现导入导出按钮 2-6 使用Bootstrap实现数据表格 2-7 使用Bootstrap实现分页组件 2-8 Bootstrap实现弹出modal窗口 2-9 使用Bootstrap实现表单form的控件 2-10 使用Bootstrap实现修改会员的modal窗口 2-11 使用Bootstrap实现删除会员的modal窗口 2-12 使用Bootstrap实现导入会员的modal窗口 2-13 Bootstrap总结

如果你想了解的话可以免费的去看看哦~~~~完善个人信息免费得蛙币哦~

一小时上手Bootstrap3|Bootstrap视频课程 - 蛙课视频

会css和html的人：这玩意也能叫框架？不会css和html的人：这东西看上去蛮吊哦！

这是正常的。

好比我们做数学题，一开始怎么想也找不到思路，然后看参考答案，焕然大悟，原来挺简单的，这是为什么呢？

其实说白了就是不熟，运用得不够。别急的做出很漂亮的样式，先熟悉官方文档，哪里看不懂，先上网查一下，可以照葫芦画瓢写一个，如果哪里有自己的思路，可以换掉它，不用多久，你就能熟能生巧。bootstrap我刚学的时候，拿着书，看着官方文档，一步一步来，毕竟这是别人写的框架，虽然你可能不喜欢别人的命名～

之后你用的比较多了，熟了，你就会自然而然的学得更深，比如，他之前用的是less，现在用sass，我刚开始也没有学过，就是因为bootstrap学习了上面的两个。

慢慢来

bootstrap？？？看一下文档就会用了啊。。

最近对Bootstrap很感兴趣，其实对于有一定概念的人来讲上手还应该蛮快的，找一个靠谱的开发手册，操作几次就会了吧！推荐一个我学习Bootstrap用的手册：开发者手册 - 云+社区 - 腾讯云， 既有Bootstrap 4 也有Bootstrap 3，迭代学习会很棒。都是以英文文档为基础做出相应的拓展，按着套路操作操作就学会啦哈哈。有经验的人可以一起交流交流吼吼！

说白了还是css3的基本功不够扎实，建议你还是先老老实实的打好css基础。

一般来说对着文档写就可以了。

可以自己先用HTML+CSS撸一个静态的页面。写完之后看bootstrap就简单多了。静态页面可以写一个博客，参考这个 http://www.gaoyakang.tk

其实你有html css js的基础，看看bootstrap的官方文档，然后自己写一个基于bootstrap的页面基本上就可以了

推荐一个网站：Java 全栈工程师 | 以实例驱动学习 | how2j.cn；

我和题主情况一样，前端的东西都没有接触过，这个网站上有html、css、javascript、jquery、bootstrap各种前端教程，学起来很快，几天时间就可以学完了，而且站长还准备了示例项目，让你一点一点跟着学，不要太简单呀。。。我学完后马上就做了个仿知乎的站。。。。。感觉自信心爆棚啊。。。。

只要了解 HTML/CSS/JavaScript, 闭着眼去 Bootstrap 中文网照着代码写一份, 就都会了吧, 想深入的话, 看看源码就可以了...

bootstrap 不是后端程序员来写前端产生的 ABC 型快速开发框架嘛...你会英文还不会说 ABC 嘛?

亲，可以尝试一下阿里云大学推出的：Bootstrap在线学习课程开

Bootstrap，来自Twitter，是目前最火的前端开发框架。

由Twitter的设计师Mark Otto和Jacob Thornton合作开发，基于 HTML、CSS和JAVASCRIPT ，Bootstrap更加的简洁灵活，使得 Web 开发更加快捷。并且提供了优雅的HTML和CSS规范，一经推出后便颇受欢迎，一直是GitHub上的热门开源项目。目前包括NASA的MSNBC（微软全国广播公司）的Breaking News都使用了该项目，另外国内一些移动开发者较为熟悉的框架，如WeX5前端开源框架等，也是基于Bootstrap源码进行性能优化而来。

那么，前端框架Bootstrap的使用，应该学习哪些内容呢？

Bootstrap全局css样式_栅格Bootstrap全局css样式_排版Bootstrap全局css样式_代码Bootstrap全局css样式_表格Bootstrap全局css样式_表单Bootstrap全局css样式_按钮Bootstrap全局css样式_图片Bootstrap全局css样式_辅助类..........最火的前端开发框架Bootstrap使用教程- 阿里云大学

但是在学习Bootstrap前，一定要先了解HTML、CSS、和JavaScript 的基础知识，如果你还不了解，可以先查看以下内容：

HTML+CSS 基础：零基础学前端HTML+CSS-阿里云大学CSS基础：前端开发CSS基础 - 阿里云大学

之后小编还会持续更新Bootstrap学习中遇到的难点,欢迎关注！

阿里云大学自5月正式开课以来，已经汇聚了10多节优质技术开发课程，欢迎各路小伙伴关注专栏学习：阿里云大学 - 知乎专栏

学了有疑问来问，别什么都不看一上来就如何学习。

很久之前就有很多人给我推荐twitter的Bootstrap框架，但是直到前几天我才真正学习了下Bootstrap，的确是相当棒的框架，至少从视觉体验上超越了很多以前碰到了前端UI框架。今天我要聊聊Bootstrap，最后给出一份我整理的Bootstrap的UI的demo，以及我自己使用Bootstrap开发的例子。

　　下面我在这里简单的介绍下Bootstrap框架。

　　Bootstrap框架属于UI框架，这个和jQuery不太一样，其实准确的描述Bootstrap框架属于css框架而非javascript框架，但是它本身也使用javascript来完善Bootstrap框架的视觉效果。此外，Bootstrap框架十分超前，在支持html5和css3的浏览器上表现特别好，而且对移动终端的浏览器支持也是相当。

　　一个完整的Bootstrap框架包含如下四个部分：

脚手架（不知道官网为啥这么翻译）：用于重置背景、链接样式、栅格系统等，并包含两个简单的布局结构。Bootstrap的样式使用了lesscss技术，比如重置背景这样的操作，这些比较简单我就不展开叙述了，脚手架里最出彩的是栅格系统和布局。栅格系统是将页面宽度分成12列，栅格系统分为两种类型，一种是默认栅格系统，这时候栅格系统是按940px像素进行等分，我们可以使用span1，span4这样的class属性操作默认栅格布局，另一种是流式栅格系统，这个时候分列的宽度就不是固定，而是根据你可视页面进行12等分，同样可以使用span1，span4操作流式栅格。这个系统非常之好，做css最难的就是div布局，使用栅格系统可以大大简化div的布局操作。另外一个就是做布局操作了，布局也分为固定和流式，让不太精通css布局也能轻松操作布局。web前端学习群：611 428 142 点击链接加入群【网页制作学习群】：https://jq.qq.com/?_wv=1027&k=49ZfTHl 基本的css样式。Bootstrap给出了一样常用的HTML元素的样式，例如：按钮、表单和文字等等。大部分做网站的人都不是美工出身，做出赏心悦目的网页是件很困难的事情，css提供的样式很专业很精美，能让我们轻松开发出一套精美的网站

Css组件：Bootstrap还提供一些常用的css组件，同样很很棒。

Javascript插件：Bootstrap是个开放的系统，我们可以随意扩展Bootstrap，特别是javascript的框架，这样Bootstrap就会更加专业。

　　Bootstrap是个操作性质的框架，没必要做深入分析，最关键是有没有好的使用实例，我下载Bootstrap发现，下载包里的example不是太强大，例子都在它的官网上，很多对css和javascript不是特别熟悉的人使用起来都不太习惯，因此我将这些例子进行了整合，作为单独的例子工程，这个工程非常全面，我在网上找过，目前还没有比我整理的更详尽的例子，大伙下载下来按照我的工程目录结构就可以进行开发了。此外，我做了一个简单的demo，也分享给大家，demo的截图是：

建议一般先学会排版布局吧。这个是最最有用的。从最基本的bootstrap框架开始学习。首页上的其他一些都是扩展性的框架可以先不学。等完全了解了bootstrap基本的一些排版布局以及样式，学习其他的也就不难了。其实bootstrap学习起来还是很简单的吧。布局的话就是百分比布局和栅栏式布局为主。其他的类似 按钮 .btn 报错提示 .alert-block 都是利用了组合式的class如 。.btn .btn-success就是绿色按钮。.btn+后缀（其实就是一个色系）。个人任为bootstrap最强大的一点就是组合式class，随心搭配。从排版布局到css最后到bootstrap.js（个人认为使用的几率不大，兼容性和实用性并不是更好。js初学者用用很不错。常用的也就那几个，毕竟万恶的ie在国内还是根深蒂固的）按照这个步骤看完，再自己做一些小的demo很快上手的。

只要具备看文档的能力就会用bootstrap，真的，复制粘贴都能看到效果。

bootstrap本质上就是一堆预设样式以及插件的集合，使用上并没有太深奥的东西，这也是bs能流行的原因之一。

玩不玩得转就看你理解能力和熟练程度了，如果你要深度定制的话。但是一般的运用，你只需要不厌其烦地查文档看Demo复制粘贴就可以了。

当然如何更合理地、高效地组织和运用，则需要一些经验指导。

这种手册式的很适合快速入门，可以参考下

Bootstrap入门 | it自学教程

我觉得Bootstrap就是一个ui库吧，等你学完html/css，懂点javascript，

Bootstrap的话看看文档就可以直接拿来用了，根本不用专门去学的。

看到这个问题，其实我特别想问楼主一句，楼主是不是HTML CSS也不熟？

楼主如果对HTML CSS熟的话，肯定会chrome调试。bootstrap那些写好的class到底做了什么，楼主一看便知，学习起来应该轻松加愉快。

所以我大胆猜测楼主应该是html css不熟。

基于以上假设，不建议楼主目前学习bootstrap，bootstrap也没法做到让不会html css的人写出漂亮网页。现在很多好看的基于bootstrap的网页其实都是作者自己写了很多样式的。

建议楼主先去把html+css学熟练了，再考虑bootstrap（或许到那个时候，你就会觉得bootstrap对自己创作是一种约束了，就不会用了，逃）

点赞加关注，干货持续分享中

完全看不懂的话，建议先学习HTML、CSS以及JavaScript基础，这样可以帮助你更好的学习bootstrap框架。

然后可以看看Bootstrap 中文文档 · Bootstrap 是世界上更流行的、移动设备优先的、响应式前端开发框架。

参照其中的例子，CSS样式，组件，JavaScript插件，都可以一一尝试，自己按照实例实现一下，可以参照文档来开发。

你实际项目中需要用到什么组件，导航，按钮还是弹出框，可以再去详细了解相关的文档。.

题主一看就不只是没学过任何前端框架的问题，对HTML和CSS恐怕也不是很熟悉，没有自己的理解。建议夯实基础，再看bootstrap的教程不会有太大难度的。给题主推荐几本HTML和CSS的书吧

Head First HTML与CSS、XHTML（中文版）

CSS权威指南（第三版） (豆瓣)

精通CSS（第2版） (豆瓣)

虽然HTML和CSS的语法简单，但是不代表不重要啊，基本思想搞不清，用框架当然只能比葫芦画瓢了，更好把前两本读了，边读边思考边写代码效果会更好。等你学好了，再看boostrap一目了然，事半功倍，加油！