Bootstrap入门
一、概念
Bootstrap,是目前很受欢迎的前端开发的框架。Bootstrap 基于 HTML、CSS、JavaScript 的,它简洁灵活,使得 Web 开发更加快捷。
框架:一个半成品软件,开发人员可以在框架基础上,在进行开发,简化编码。
好处:
1. 定义了很多的css样式和js插件。开发人员直接可以使用这些样式和插件得到丰富的页面效果。
2. 响应式布局。
* 同一套页面可以兼容不同分辨率的设备。
二、下载bootstrap
1.进入bootstrap中文网
2.来到下载页面 https://v3.bootcss.com/getting-started/#download
3.选择 用于生产环境的Bootstrap 下载即可
4.下载完成,下面为下载的压缩包,上面是解压后的
三、导入Bootstrap
1.将下载好的Bootstrap解压导入项目
2.到bootstrap中文网的起步中往下拖,拖到基本模板
3.将基本模板的代码复制下来,并将其中导入的css、js、jq(官网下即可)修改成自己下载的
注:如果不下载 bootstrap,则可以直接用该模板,并直接到第四步
四、使用Bootstrap
1.到bootstrap中文网下,找自己需要的样式、组件等,直接将其代码复制下来粘贴到自己代码里即可
例如:想使用下图的 绿色成功 按钮,则直接将其相应的代码复制粘贴即可
粘过来后的代码如下:
效果如下: