1. 先搭建环境,下载node.js,rubyinstaller,安装, 安装rubyinstaller时,要选上include system path,这样就会自动将node.js执行添加到windows系统环境变量,免去手动创建烦恼.node.js就点下一步安装就行了

2. win+R cmd 再运行  gem install bootstrap-sass

3.创建一个项目 cd 进入到你所在的项目存放目录,命令行窗口运行 compass creat XXXXX(项目名称)这样就创建了一个项目会生成如下所示目录

4.右键打开 config.rb  在require 'compass/import-once/activate' 下面加一行 require 'bootstrap-sass'

5.打开sass 目录下的 { @import "compass/reset"; } 这个注释或删掉都行,再添加一行 @import "bootstrap";

6.在刚才的命令窗口处compass compile 编译下.这样就可以在 sass 目录下操作你想要操作 .scss 了,然后就compass compile , 当然了,如果你不想老是输入compass compile你就在命令窗处输入 compass watch -p 监听,这样的话就会自动编译你更改的.scss 或.sass文件,将其输出到stylesheets中的对应文件.css中

好了,写完了。适合对sass ,compass,bootstrap有所了解的园友。

补充下,如果没有创建新的项目可在命令行窗口中使用此命令 compass creat xxxxx(项目名) -r bootstrap-sass --using bootstrap  之后会得到如下文件目录

sass+compass+bootstrap三剑合璧高效开发记录的更多相关文章

  1. CSS高效开发实战:CSS 3、LESS、SASS、Bootstrap、Foundation --读书笔记(1)设定背景图

    技术的新发展,除计算机可以接入互联网之外,平板电脑.智能手机.智能电视等其他设备均可访问互联网.在多设备时代,构建多屏体验也不是听说的那么难. 但是这也增加了学习CSS的难度?不知道如何上手,只懂一点 ...

  2. 只会CSS还不够,LESS、SASS、BootStrap、Foundation一网打尽!

    有些人想学CSS,不知如何下手:有些人已经学会CSS的各种属性,却不知如何运用:有些人会平面设计,不知道如何与网页设计结合:有些人会HTML,就是学不会CSS.试问自己,图中的技术你都会了吗? 别总是 ...

  3. Android APP高效开发的十大建议

    在使用Android开发APP过程中,为什么确保最优化.运行流畅且不会使Android系统出现问题至关重要呢?因为影响APP产品效率的每一个问题,如:耗电或内存占用情况等,都是关乎APP成功与否关键因 ...

  4. LNMP系列网站零基础开发记录(三)

    [目录] 扯淡吹逼之开发前奏 Django 开发环境搭建及配置 web 页面开发 Django app开发 Django 站点管理 Python 简易爬虫开发 Nginx&uWSGI 服务器配 ...

  5. windows下的SASS/Compass的安装与卸载

    认识SASS/Compass SASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护. SASS与Compass的安装说明 SASS在Wind ...

  6. EXT.NET高效开发(二)——封装函数

    在上一篇<EXT.NET高效开发(一)--概述>中,大致的介绍了一下EXT.NET.那么本篇就要继续完成未完成的事业了.说到高效开发,那就是八仙过海各显神通.比如使用代码生成器,这点大家可 ...

  7. .Net 高效开发之不可错过的实用工具(转)

    .Net 高效开发之不可错过的实用工具(转) 本文摘自: http://www.cnblogs.com/powertoolsteam/p/5240908.html#3372237 Visual Stu ...

  8. 20145337实验三实验报告——敏捷开发与XP实践

    20145337实验三实验报告--敏捷开发与XP实践 实验名称 敏捷开发与XP实践 实验内容 XP基础 XP核心实践 相关工具 ** 实验步骤**### 敏捷开发与XP 软件工程包括下列领域:软件需求 ...

  9. window 安装 sass compass 记录

    1.安装Ruby 安装sass 和compass 需要 Ruby 的环境,还区分xp 和win7-8 下版本区别 ruby 官网中文 ruby 官网英文 注意: xp: 下载 [xp不能下载包含64位 ...

随机推荐

  1. java:[1,1] 需要class, interface或enum

    状态: cmd编译.java文件时报异常:java:[1,1] 需要class, interface或enum异常原因: 主要原因是java文件的编码问题. 在中文操作系统中,使用一贯的"j ...

  2. STL or 线段树 --- CSU 1555: Inversion Sequence

    Inversion Sequence Problem's Link:   http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1555 Mean: 给你一 ...

  3. ASP.NET MVC的路由

    好久没写博文了,感觉最近好像少了点动力.唉!这回就看看这个MVC的路由. 说这个路由机制其实不是MVC里面特有的,ASP.NET里面本身就有的,只不过在WebForm里面一般比较少用,而在MVC里就是 ...

  4. KTV点歌系统

    经过十多天的艰苦奋战,MyKTV点歌系统终于成型,从刚开始接到项目的茫然,到完成项目时的喜悦,整个过程的艰辛和付出只有自己知道.虽然这个项目还有许多需要完善的地方,譬如添加歌词信息,实现窗体的美化等, ...

  5. android studio...混淆打包全揭秘

    前言,当前android studio使用的版本较新,低版本的如果有差异,或者问题,欢迎拍砖! 1.修改配置文件 找到配置文件,build.gradle,修改如下.    signingConfigs ...

  6. 通过代码的方式完成WCF服务的寄宿工作

    使用纯代码的方式进行服务寄宿 服务寄宿的目的是为了开启一个进程,为WCF服务提供一个运行的环境.通过为服务添加一个或者多个终结点,使之暴露给潜在的服务消费,服务消费者通过匹配的终结点对该服务进行调用, ...

  7. [moka同学笔记]yii2.0表单的使用

    1.创建model   /biaodan.php <?php /** * Created by PhpStorm. * User: moka同学 * Date: 2016/08/05 * Tim ...

  8. java中的代码块执行顺序

    /* 代码块:在Java中,使用{}括起来的代码被称为代码块. 根据其位置和声明的不同,可以分为 局部代码块:局部位置,用于限定变量的生命周期. 构造代码块:在类中的成员位置,用{}括起来的代码.每次 ...

  9. quartz使用(一)

    在项目中经常会碰到定时任务,quartz是一款非常优秀的开源框架, 提供了定时任务的支持,还支持任务的持久化,并且提供了对数据库的支持.下面首先对quartz做一个简单介绍,并附上一个小例子. 1.下 ...

  10. winform(数据导出、TreeView的使用)

    一.数据导出:目标: 将数据库的数据导出成Excel工作表或是Word文档 基本步骤: 1.首先将数据库中的数据封装成实体类 2.写好查询数据的方法,在主窗体中调用查看所有的数据 3.利用saveFi ...