sass的安装与使用

一、SASS简介:SASS是一种使CSS的开发,变得简单和可维护开发工具。
二、安装和使用
2.1 SASS的安装:
安装sass之前首先需要安装ruby,ruby的安装可以直接在百度搜索安装,安装安装过程中如下图,记住勾选红框内的选项:

安装完ruby后,在开始菜单中找到并点击打开: Start Command Prompt with Ruby
SASS的四种安装方式:
(1)第一通过ruby命令: 在命令行输入 gem install sass //第一种方法因为国内互联网的屏蔽关系,所以一般安装失败。
(2)第二通过淘宝镜像: (1移除默认的源: $ gem sources --remove https://rubygems.org/
(2添加淘宝的源: $ gem sources -a https://ruby.taobao.org/
(3)第三通过腾讯镜像: (1移除默认的源: $ gem sources --remove https://rubygems.org/
(2添加淘宝的源: gem sources -a http://gems.ruby-china.org/
--------------------------------------------------------------------
( 查看当下使用的源: $ gem sources -l
查看sass的版本: sass -v
更新sass版本: gem updata sass
帮助命令: sass -h
)
(4)第四通过git命令行: git clone git://github.com/nex3/sass.git
cd sass
rake install
第四种方法目前作者目前尚不知如何使用,读者慎用!!!!!!!!!!!!!!
三、通过webstorm开发工具进行编译,安装完webstorn后,打开:
①点击 files,找到 seetings
②点击下方Tools,然后找到 file watchers 选项,如下图所示,点击右上角的+号,选中SCSS,进入配置界面,根据需要编辑需要修改的参数,最后点击ok。

③新建一个XXX.scss文件,编辑,这时我们会发现在XXX.scss目录下会生成一个demo.css的文件
④我们在html页面引入样式时,直接引入css文件即可
参考链接1:http://www.cnblogs.com/shudaixiong-w/p/6001663.html
参考链接2:http://www.cnblogs.com/lhy-93/p/5473377.html
sass的安装与使用的更多相关文章
- 关于sass的安装
关于sass的安装真是费了九牛二虎之力,这么说一点都不夸张,好了我就不多浪费口水了,直接进入正题 1.首先要安装ruby,这个大家可以去度娘上查询,很好安装的,相信大家的智慧与实力都是可以安装成功的 ...
- SASS的安装及使用(前提:安装Ruby)
本文仅适用于Windows系统. 一.安装Ruby Sass是用Ruby语言写的,但是两者的语法没有关系,所以学 Sass 不用学 Ruby,只是必须先安装Ruby,然后再安装Sass. Linux和 ...
- 学习Sass之安装Sass(一)
为什么使用Sass 作为前端(html.javascript.css)的三大马车之一的css,一直以静态语言存在,HTML5火遍大江南北了.javascript由于NODE.JS而成为目前前后端统一开 ...
- Windows下sass的安装
sass依赖Ruby,所以,首先得先安装个Ruby 安装步骤: 1.安装Ruby的时候,勾上Add Ruby executables to your PATH(添加环境变量) 2.安装好Ruby之后, ...
- 学习Sass之安装Sass
学习Sass之安装Sass 为什么使用Sass 作为前端(html.javascript.css)的三大马车之一的css,一直以静态语言存在,HTML5火遍大江南北了.javascript由于NODE ...
- 1.sass的安装,编译,还有风格
1.安装sass 1.安装ruby 因为sass是用ruby语言写的,所以需要安装ruby环境 打开安装包去安装ruby,记住要勾选 下面选项来配置环境路径 [x] Add Ruby executab ...
- SASS的安装和转换为CSS的方法
http://www.cnblogs.com/52css/archive/2012/08/19/sass-how-to-install-and-use.html SASS的安装方法: 1.先安装Rub ...
- sass的安装
sass的安装 1.当ruby安装完成后,在自己电脑开始菜单下面找到ruby的控制台"cmd"; 2.然后直接在命令行中输入 gem install sass 3.在安装过程中 可 ...
- Sass环境安装-Sass sublime 编辑器插件编译方法
首先官网(http://www.ruby-lang.org/en/downloads/)下载 ruby (1)打开链接进入到下载页面,点击如下位置进行下载 (2)下载页面 (3)进入到各个版本的列表页 ...
随机推荐
- python中enumerate()的用法
先出一个题目:1.有一 list= [1, 2, 3, 4, 5, 6] 请打印输出:0, 1 1, 2 2, 3 3, 4 4, 5 5, 6 打印输出, 2.将 list 倒序成 [6, 5, ...
- solr索引服务器的配置和solrj集成开发总结
一.环境:solr6.2 + jdk1.8 + tomcat8 (solr不同版本需要最低的环境不同) solr6 需要至少jdk1.8 .对应的solr5+jdk1.7+tomcat7 实测 ...
- javascript温故知新
1 javascript作用域 初学javascript的时候,变量的作用域就感觉有些麻烦,他不像C#或java那样清晰明了,貌似处处都在作用域内,但有时会处处都是空. javascript中,变量的 ...
- JAVA字符串的相关练习
/*String s = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";//生成随机验证码 fo ...
- ionic 集锦
一.隐藏返回按钮 场景:登录.注册成功后,阻止返回 //方法一 $ionicHistory.currentView($ionicHistory.backView()); $state.go('home ...
- bzoj 3530: [Sdoi2014]数数
#include<cstdio> #include<iostream> #include<cstring> #define M 1509 #define MO 10 ...
- SQL查询关于相对路径、矢代、绝对路径、递归、计算列的速度对比跟优化-SOD群记录
1秒查原本递归的查询. 适用于:上下级.多层查询 -- Get childs by parent id WITH Tree AS ( SELECT Id,ParentId FROM dbo.Node ...
- AFN断点续传思路
- NethServer 7.2 RC1,增加深度数据包检测
NethServer 7.2 RC1 "Saltimbocca" 发布了,NethServer是基于CentOS的面向服务器的Linux发行.该产品的主要特性是模块化的设计,这使 ...
- jQuery专题
jQuery概述 ·为了简化JavaScript的开发,一些JavaScript库诞生了.JavaScript库封装了很多预定义的对象和实用函数.能帮助使用者建立有高难度交互的Web2.0特性的富客户 ...