工具:可以使用 或者不使用
使用工具可以帮我们更加快捷的处理一些事情
Npm : 很多插件 都是基于npm ,需要使用npm去安装 卸载
Postcss:可以帮我们处理CSS文件
我们希望它可以自动生成兼容的前缀(各个浏览器厂商为了显摆自己,加了自己特殊的名字)不加这个特殊名字就不识别
autoprefixer 可以帮我们添加前缀
1.下载Postcss-cli 和 autoprefixer
如果一块安装: cnpm(npm) i postcss-cli autoprefixer -g
一个个安装:
cnpm(npm) i postcss-cli -g
cnpm(npm) i autoprefixer -g
附cnpm的安装方法 在终端复制小括号内的代码
(npm install -g cnpm –registry=https://registry.npm.taobao.org)
安装好之后 会在终端里面 显示

2.打开webstrom 点击 文件(file)->设置(settings)->工具(tools)->扩展工具(extend tools)->点击加好

3.配置扩展工具
如下图

4.给扩展工具添加快捷键


5.开始用使用
写好每一个自己的css文件之后 在随意位置 按 刚才设置的快捷键(shift+/) 就可以 帮咱们添加好 需要添加 前缀的样式代码
效果:
未添加前缀

使用快捷键(shift+/)添加后的

注意:工程目录的名字(index.html外层的文件夹) 不要起有特殊字符的名字(尽量不是中文)(?~!#@¥%……&*())
BootStrap:
安装:
1.下载引入css和js
2.通过npm去安装
3.通过bower安装
Bower是一种包管理工具 可以通过bower 去搜索、下载安装、卸载所有发布在github里面的插件
在安装bower之前 需要安装node 和git
Bower的安装 跟使用npm 安装其他插件 一模一样 cnpm(npm) i bower -g
Bower的使用:
1.搜索search
2.下载安装 i
3.卸载 uninstall
搜索:
bower search bootstrap
bower search jquery
安装:
Bower i bootstrap
Bower i jquery
卸载
Bower unistall bootstrap
Bower 在安装的时候 如果 有需要安装的 其他插件 会自动安装 需要的插件
安装好了之后 会在 当前的工程里面 多了一个文件夹

手动下载BootStrap:

或者直接使用cdn的方式
https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js
https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css
使用栅格布局:把一《行》分成了12等份 想让一《列》占几份 就分几份 如果超出12份 会自动流下来
根据不同屏幕的尺寸 有不同表示12等份的名字

**注意:如果想使用栅格布局 使用栅格布局的直接父元素 必须是row
注意:如果希望在某个尺寸的屏幕以上 显示一行 需要以最小屏幕为基准
比如:md 已上 都是一行6列 md-6 以相同的列数显示 lg就不需要设置**