最近因为工作需要,自学了Sass。现在将学习笔记整理在这里,供大家参考。

1. Sass的安装

Sass的编辑器安装方法有很多,大致能分为两种:应用程序(application)和命令行界面(command line)。我使用的是命令行。因为之前已经在Mac上安装过Homebrew的package,用的命令行是

brew install sass/sass/sass

Homebrew对系统xCode版本有要求,如遇提示xCode版本过低,在App Store下载更新软件,或者直接卸载软件都可以。

如果已经安装过node.js,也可以使用npm指令

npm install -g sass

如果提示权限不足,在命令行前加上sudo即可。

参考网页 https://sass-lang.com/install

2. Sass编辑器的使用

Sass的使用很简单,记住两条指令即可。
第一条指令如下,意思是编辑input.scss,并输出储存在output.css文件中。指令只编译一次。

sass input.scss output.css

第二条指令增加了一个watch功能。同上述指令,编译input.scss储存至output.css。指令编译多次,适用于开发过程中的编译。.scss文件的改动会被检测(watch)并立即编译写入相应的.css文件中。

sass --watch input.scss output.css

3. 其他

Sass的语法有很多资源都体积到了,在此就不赘述了。
推荐几处参考网站:

本文转载于:猿2048➥https://www.mk2048.com/blog/blog.php?id=hch0j1b21cb

学习笔记 - Sass的安装与使用手册的更多相关文章

  1. PHP学习笔记----IIS7下安装配置php环境

    原文:PHP学习笔记----IIS7下安装配置php环境 Php如何安装 Php版本的选择 Php在windows下的(php5.4.7)有两种版本: VC9 x86 Non Thread Safe ...

  2. openresty 学习笔记一:环境安装

    openresty 学习笔记一:环境安装 openresty 是一个基于 Nginx 与 Lua 的高性能 Web 平台,其内部集成了大量精良的 Lua 库.第三方模块以及大多数的依赖项.用于方便地搭 ...

  3. 学习笔记--Grunt、安装、图文详解

    学习笔记--Git安装.图文详解 安装Git成功后,现在安装Gruntjs,官网:http://gruntjs.com/ 一.安装node 参考node.js 安装.图文详解 (最新的node会自动安 ...

  4. Python3学习笔记01-环境安装和运行环境

    最近在学习Python3,想写一些自己的学习笔记.方便自己以后看,主要学习的资料来自菜鸟教程的Python3教程和廖雪峰官方网站的Python教程. 1.下载 1)打开https://www.pyth ...

  5. 树莓派学习笔记——apt方式安装opencv

    0.前言     本文介绍怎样在树莓派中通过apt方式安装opencv.并通过一个简单的样例说明怎样使用opencv. 相比于源码方式安装opencv,通过apt方式安装过程步骤简单些,消耗的时间也少 ...

  6. Git学习笔记--历史与安装(一)

    声明:今天起学习Git,第一篇学习笔记主要借鉴廖雪峰先生的个人博客,以及自己的实践所得. “本教程只会让你成为Git用户,不会让你成为Git专家”——引自廖雪峰博客. 一.Git简介 Git是目前世界 ...

  7. sass学习笔记 -- sass的四种编译方法

    sass的四种编译方法:(.scss) (一)ruby下的命令行编译 首先需要安装ruby,注意需勾选Add Ruby executables to your PATH选项,以添加环境变量. ruby ...

  8. Linux 学习笔记 2 Centos 安装与网络的配置以及VI编辑器的使用

    前言 当然,还是觉得Centos 在众多的Linux 发行版中,还是很有地位的,好多的服务器大多沿用的都是一代的Centos 因为它开源(这是废话)而且稳定,这才是服务器沿用的最重要的一项指标. 镜像 ...

  9. Maven学习笔记(1)之安装Maven

    此笔记是学习Maven时自己摸索+各种百度而来,并非全部原创,望与各位一同学习,勿拍~勿拍~ 安装步骤 1.下载Maven的最新版本,地址:http://maven.apache.org/downlo ...

随机推荐

  1. ValueError: not enough values to unpack

    当在同一行为两个变量赋值时,要用分号;而非逗号,隔开

  2. 使用Python绘制彩色螺旋矩阵

    from turtle import* #导入turtle库 bgcolor("black") #设置画布颜色为黑色 speed(0) #设置画笔绘制速度 colors=[&quo ...

  3. Python回顾笔记(此讲大致说明,详情请看之前的笔记)

    内容概要 数据分析(numpy,pandas,matplib) 数据清洗 爬虫 teableau软件 今日内容概要 Python知识回顾 数据分析 ipython模块 anaconda软件 numpy ...

  4. JZ-007-斐波那契数列

    斐波那契数列 题目描述 大家都知道斐波那契数列,现在要求输入一个整数n,请你输出斐波那契数列的第n项(从0开始,第0项为0,第1项是1). n<=39 题目链接: 斐波那契数列 代码 publi ...

  5. tp6 的安装步骤 及简易命令

    1:https://www.kancloud.cn/manual/thinkphp6_0/1037481 官网下载 composer create-project topthink/think tp6 ...

  6. PHP实现二维数组(或多维数组)转换成一维数组

    1 array_reduce函数法 用array_reduce()函数是较为快捷的方法: $result = array_reduce($user, function ($result, $value ...

  7. Forbidden You don't have permission to access this resource. 解决办法!

    这两天在使用hmailserver+roundcubemail 搭建邮箱时遇到的一些坑和大家分享一下,避免少踩坑. 关用httpd.conf及httpd-vhosts.conf配置我贴出来供大家参考. ...

  8. 监听页面中的某个div的滚动事件,并将其滚动距离保存到cookie

    在html中,写一个id为type的div: <div class="type" id="type"></div> css: .type ...

  9. Net中事件的用法之二

    1.委托与事件的区别 事件对权限做了控制 1.委托可以直接调用 事件不可以直接调用 2.委托允许外面直接赋值 事件不允许外面直接赋值 2.事件与委托的实例比较 using System; using ...

  10. 远程控制Windows2003下安装Pcanywhere导致Awgina.dll出错的解决办法

    远程控制的时候出现的问题引用 症状启动计算机时,"欢迎使用 Windows"登录屏幕不出现.您还可能会看到与下面的某条信息类似的错误信息: ? 一个最近安装的程序使欢迎屏幕和快速用 ...