对Bootstrap的认识过程

过程"/>

对Bootstrap的认识过程

1、什么是bootstrap？

Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、 JAVASCRIPT 的。 在企事业、机关、组织等单位的内部管理系统。积云教育：内部 学生管理系统、讲师管理系统等系统使用 bootstrap框架最多。

1.1、为什么使用bootstrap

1、移动设备优先：自 Bootstrap 3 起，框架包含了贯穿于整个库的移动设备优先的样式。 2、浏览器支持：所有的主流浏览器都支持 Bootstrap。 （js语言在全球开发者中占比很大的基数） 3、容易上手：只要您具备 HTML 和 CSS 的基础知识，您就可以开始学习 Bootstrap。 4、响应式设计：Bootstrap 的响应式 CSS 能够自适应于台式机、平板电脑和手机。更多有关响应式设计 的内容详见 Bootstrap 响应式设计。（web开发的难点之一 多端适配） 之前： web1.0（互联网时代） 2000-2010年 web2.0（互联网的时代）08年iphone 09android 2010-2020年 移动互联网

1.2、bootstrap下载地址

下载地址：bootstrap安装包

1.2.1、预编译的bootstrap （文件结构）

当您下载了 Bootstrap 的已编译的版本，解压缩 ZIP 文件，您将看到下面的文件/目录结构：

1.2.2、Bootstrap 源代码

如果您下载了 Bootstrap 源代码，那么文件结构将如下所示：

1.less/、js/ 和 fonts/ 下的文件分别是 Bootstrap CSS、JS 和图标字体的源代码。
2.dist/ 文件夹包含了上面预编译下载部分中所列的文件和文件夹。
3.docs-assets/、examples/ 和所有的 *.html 文件是 Bootstrap 文档。

1.3、bootstrap风格页面展示

步骤： 1、新建一个html文件
2、引入css文件（bootstrap） 官网cdn上的css文件
3、引入js文件 因为bootstrap的js实现是依赖于jquery，所以要先引入jquery文件
4、在body中增加dom元素，布局页面（css风格，js简单功能实现都不用做

职场中的开发流程

2、express如何引入bootstrap

1、新建一个express工程 命令： express 工程名称 （express生成器的全局安装）
2、启动工程 2.1 先进入工程项目 cd myapp
2.2 安装工程模块依赖 npm install 2.3 启动项目 npm start
3、在public（静态文件托管文件夹）新建html文件
3.1、引入bootstrap的文件（css、js）
3.2、创建一个html文件，在此文件中，把bootstrap的css、js文件引入到此html文件中

bootstrap.js和bootstrap.min.js区别
一个是压缩过的，文件变小有利于网络传输，一是页面更快的渲染出来，另一个是减少了web服
务的访问流量。也是对web服务器的减压
开发环境可以使用未压缩的文件
生成环境可以使用压缩过的文件

总结

以上就是今天对Bootstrap的认识过程
会持续更新中…
原创不易，期待您的点赞关注与转发评论😜😜