前端学习(八）sass和bootstrap（笔记）

less

sass 和less基本上70%差不多（书写方式不一样）

sass功能更多一点

1.定义一个变量

$b:blue;

div{width:100px;height:100px; background:$b;}

2.运算


div{width:100px*2;height:100px+100px; background:$b;border-left:(10px/2-4px) solid #000;}

3.嵌套
（和less一某一样）


4.伪类
（和less一某一样）

5.代码的重用


6.定义一个选择器
======================================================

---------------------
npm --包管理工具！

npm--全称： Node Package Manager

nodeJS管理器

npm咋用？---从国外的服务器上下载你需要的文件（代码的框架）

步骤：
    1.下载找一个包管理器：
        npm nodeJS

    2.指定下载到某一个文件夹：
        默认c/...

        切换盘：E： 回车
        进入文件：cd 文件名

        下载（在命令行）：npm install bootstrap@1.7.3

        简写：npm i bootstrap@1.7.3    

    注意：有时候会下载失败！
        原因：1.npm是外网，网速慢
              2.网速慢

失败解决方法:(为了解决下载慢)
使用cnpm！

cnpm（阿里巴巴镜像（http://npm.taobao.org/）---通过这里下载）
    
---从一个服务器（npm）镜像到另一个服务器（cnpm）里面    
安装一下：
    步骤：
        1.在命令行输入：
            npm install -g cnpm --registry=https://registry.npm.taobao.org

        2.cnpm install bootstrap


Bower ！---
=====================================================


bootstrap


缺点：
    1.不能按照设计图百分百还原！（模样单一）
    2.太大，框架多，代码多，---资源多！

优点：
    1.大，全，功能不用自己写！
    2.可以快速写一个页面！

注意：
    以下实例全部基于前面所讲的基本模板并配合 Bootstrap 的众多组件开发而成。我们鼓励你根据自身项目的需要对 Bootstrap 进行定制和修改。

定制：就是直接从官网上找模板

修改：直接修改这写模板（30%-背景色-字体颜色-宽高-距离）


======================================================    

css框架！

里面已经给你写好css和js


组件：
    Glyphicons 字体图标---http://www.iconfont.cn/阿里妈妈图标