多语言展示
当前在线:128今日阅读:179今日分享:36

win7下SASS环境配置并使用介绍

Sass 是对 CSS 的扩展,让 CSS 语言更强大、优雅。 它允许你使用变量、嵌套规则、 mixins、导入等众多功能, 并且完全兼容 CSS 语法。对于前端人员确实有必要掌握。我因为兴趣自己玩玩,记录下希望能帮助初学的朋友
工具/原料
1

window 7 64

2

Ruby

方法/步骤
1

Ruby环境安装1、Ruby安装包下载地址:http://rubyinstaller.org/downloads/下载对应系统版本的安装包;2、双击rubyinstaller-2.2.3-x64.exe开始安装,如下图所示安装;3、检查是否安装成功win+r输入cmd回车打开终端输入ruby -v;

2

Gem的使用方法安装完Ruby实际上已经安装好了gem,通过win+r输入cmd回车打开终端。查看已经安装的gem软件gem listgem在线安装软件gem install (gem-name)gem卸载软件gem uninstall (gem-name)

3

通过Gem安装Compass+SassCompass是Sass的工具库(toolkit)主要功能就是可以直接创建项目、配置CSS压缩方式、配置firefox的调试信息。安装Compass(最新的Compass已经集成Sass不用单独安装)gem install compass由于网络的问题,替换淘宝镜像源进行安装$ gem sources --add https://ruby.taobao.org/ --remove https://rubygems.org/$ gem sources -l$ gem install compass

4

Compass使用方法1、创建项目 首先通过命令行进入你要创建项目的文件夹。cd\回到根目录 cd ** 进入某个文件夹。compass create myproject2、配置config.rg 主要是对压缩比例。#压缩比例output_style = (environment == :development) ? :expanded : :compresse3、实时编译sass Compass实时监控Sass目录的文件变化,只要保存文件立即将对应文件编译成css文件compass watch

注意事项

如果有任何疑问欢迎写评论有得,如果本经验帮到了你,欢迎投票点赞

推荐信息